Official Themes

# Marp Official Themes Reference Explanation of the 3 official themes included in Marp Core. Official implementation: https://github.com/marp-team/marp-core/tree/main/themes ## Official Theme List 1. **default** - Simple and versatile theme 2. **gaia** - Modern and colorful theme 3. **uncover** - Minimal and elegant theme ## Default Theme ### Features - **Colors**: White background, black text, blue accent - **Font**: Simple sans-serif - **Use for**: General presentations - **Style**: Clean, readable ### Usage ```markdown --- marp: true theme: default --- # Title Content ``` ### Available Classes #### lead (Title Slide) ```markdown # Presentation Subtitle or description ``` Centered, large text. #### invert (Inverted Colors) ```markdown # Black Background · White Text ``` Background becomes black, text becomes white. #### Combined ```markdown # Inverted Title Slide ``` Multiple classes can be applied simultaneously. ### Customization Example ```markdown --- theme: default --- section { background-color: #f5f5f5; } h1 { color: #1e40af; } ``` ## Gaia Theme ### Features - **Colors**: Colorful, vibrant accent colors - **Font**: Modern sans-serif - **Use for**: Creative presentations, design showcases - **Style**: Energetic, visually appealing ### Usage ```markdown --- marp: true theme: gaia --- # Title ``` ### Color Variations The Gaia theme has multiple color schemes: ```markdown # Default Colors --- # Inverted Colors --- # Gaia Colors ``` ### Distinctive Styles - **Gradient backgrounds**: Used in title slides - **Colorful accents**: Headings and links - **Large typography**: Impactful headings ### Customization Example ```markdown --- theme: gaia --- section { --color-background: #fff; --color-foreground: #333; --color-highlight: #e91e63; } ``` ## Uncover Theme ### Features - **Colors**: Minimal, white or black base - **Font**: Elegant serif font - **Use for**: Formal presentations, academic talks - **Style**: Refined, simple, elegant ### Usage ```markdown --- marp: true theme: uncover --- # Title ``` ### Available Classes #### lead (Title Slide) ```markdown # Presentation ``` Centered, large serif font. #### invert (Inverted Colors) ```markdown # Black Background Slide ``` Black background, white text. ### Distinctive Styles - **Serif font**: Used for headings - **Wide margins**: Minimal layout - **Center alignment**: Content tends to be centered ### Customization Example ```markdown --- theme: uncover --- section { font-family: 'Georgia', serif; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white; } ``` ## Theme Comparison Table | Feature | default | gaia | uncover | |---------|---------|------|---------| | **Background** | White | Colorful | White/Black | | **Font** | Sans-serif | Sans-serif | Serif | | **Colors** | Simple | Vibrant | Minimal | | **Use Case** | General | Creative | Formal | | **Style** | Clean | Energetic | Elegant | ## Common Class Specifications Available in all official themes: ### lead ```markdown ``` - For title slides - Centered - Large text - Hides footer/page numbers ### invert ```markdown ``` - Inverts colors - Swaps background and text colors - Dark mode style ## Theme Selection Guidelines ### When to Choose default - General presentations - Business use - Need simple, readable design - As a base for customization ### When to Choose gaia - Creative presentations - Design-related talks - Youth-oriented audiences - Need visual impact ### When to Choose uncover - Formal presentations - Academic talks - Minimal design preference - Want elegant impression ## Combining with Custom Themes ### Extending Official Themes ```css /* @theme my-custom-default */ @import-theme 'default'; section { background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%); } h1 { color: #1e3a8a; } ``` ### Switching Between Multiple Themes ```markdown --- marp: true theme: default --- # Section 1 (default theme) --- # Section 2 (gaia theme) --- # Section 3 (uncover theme) ``` Note: Theme switching within the same file has limited support. ## Practical Examples ### Using default Theme ```markdown --- marp: true theme: default paginate: true --- # Project Report October 2024 --- ## Agenda 1. Progress Status 2. Challenges and Solutions 3. Future Plans --- ## Progress Status - Task A: Completed - Task B: In Progress - Task C: On Schedule ``` ### Using gaia Theme ```markdown --- marp: true theme: gaia --- # New Product Launch Innovative Design --- ## Concept **Three Pillars** 1. 🎨 Beauty 2. 🚀 Speed 3. 💡 Usability ``` ### Using uncover Theme ```markdown --- marp: true theme: uncover --- # Research Presentation Deep Learning Applications --- ## Research Background Recent technological advances... --- ## Experimental Results Accuracy: 95.3% ``` ## Official References - **Official Theme Implementation**: https://github.com/marp-team/marp-core/tree/main/themes - **Marp Core README**: https://github.com/marp-team/marp-core - **Theme CSS Specification**: https://marpit.marp.app/theme-css