You can build themes for your [Obsidian Publish](https://help.obsidian.md/Obsidian+Publish/Introduction+to+Obsidian+Publish) site. Themes for Obsidian Publish use the same [[CSS variables]] as the Obsidian app along with [[CSS variables#Obsidian Publish|Publish-specific CSS variables]]. > [!tip] See [[Build a theme]] for more in-depth information on the `body`, `:root`, `.theme-dark`, and `.theme-light` selectors. To build a theme for your site: 1. Add a file called `publish.css` to the root folder of your vault. - You need to use a external editor to create this file, as Obsidian does not support editing CSS files. 2. Publish `publish.css` to enable the theme on your live Publish site. **Example:** ```css .published-container { --page-width: 800px; --page-side-padding: 48px; /* ... CSS variables for Publish that do not change when light or dark mode is enabled. They sometimes link to color variables in .theme-light or .theme-dark */ } .theme-light { --background-primary: #ebf2ff; --h1-color: #000000; /* ... CSS color variables for when light mode is enabled */ } .theme-dark { --background-primary: #1f2a3f; --h1-color: #ffffff; /* ... CSS color variables for when dark mode is enabled */ } ``` For more information on how to customize your site, refer to [Customize your site](https://help.obsidian.md/Obsidian+Publish/Customize+your+site).