| 1 | # Theme and Addons |
| 2 | |
| 3 | A slides project can have one theme and multiple addons. All of them can provide styles, components, layouts, and other configs to your slides project. |
| 4 | |
| 5 | ## Use a Theme {#use-theme} |
| 6 | |
| 7 | Changing the theme in Slidev is surprisingly easy. All you need to do is to add the `theme` option in your [headmatter](../custom/index#headmatter): |
| 8 | |
| 9 | ```md |
| 10 | --- |
| 11 | theme: seriph |
| 12 | --- |
| 13 | |
| 14 | # The first slide |
| 15 | ``` |
| 16 | |
| 17 | You can find the list of official themes and community themes in the [Themes Gallery](../resources/theme-gallery). |
| 18 | |
| 19 | ::: info Theme name convention |
| 20 | |
| 21 | - You can also pass a relative or absolute path to a local theme folder, like `../my-theme` |
| 22 | - You can always use the full package name as the theme name |
| 23 | - If the theme is [official](../resources/theme-gallery#official-themes) or is named like `slidev-theme-name`, you can omit the `slidev-theme-` prefix |
| 24 | - For scoped packages like `@org/slidev-theme-name`, the full package name is required |
| 25 | |
| 26 | ::: |
| 27 | |
| 28 | You can start the server and will be prompted to install the theme after a confirmation. |
| 29 | |
| 30 | <div class="language-md text-xs pl-6"> |
| 31 | <pre style="overflow: hidden; text-wrap: pretty;"> |
| 32 | <span class="token keyword">?</span> The theme <span class="token string">"@slidev/theme-seriph"</span> was not found in your project, do you want to install it now? › (Y/n) |
| 33 | </pre> |
| 34 | </div> |
| 35 | |
| 36 | or install the theme manually via: |
| 37 | |
| 38 | ```bash |
| 39 | $ npm install @slidev/theme-seriph |
| 40 | ``` |
| 41 | |
| 42 | And that's all, enjoy the new theme! For more details about the usage, you can refer to the theme's README. |
| 43 | |
| 44 | <SeeAlso :links="[ |
| 45 | 'features/eject-theme', |
| 46 | ]" /> |
| 47 | |
| 48 | ## Use an Addon {#use-addon} |
| 49 | |
| 50 | Addons are similar to themes, but they are more flexible and can be used to add extra features to your slides project. You can add multiple addons to your project, and they can be used to add extra features to your slides project. |
| 51 | |
| 52 | To use an addon, you can add the `addons` option in your [headmatter](../custom/index#headmatter): |
| 53 | |
| 54 | ```md |
| 55 | --- |
| 56 | addons: |
| 57 | - excalidraw |
| 58 | - '@slidev/plugin-notes' |
| 59 | --- |
| 60 | ``` |
| 61 | |
| 62 | You can find the list of official addons and community addons in the [Addons Gallery](../resources/addon-gallery). |
| 63 |