How does obsidian customize the css style for the specified theme

Custom CSS & Theme Design
,
1

How does obsidian customize the css style for the specified theme
1.4.5

2

Using the Style Settings community plugin, depending on what the theme offers, or with CSS snippets:

3

This CSS snippets is a global setting. I only want to set a certain theme without affecting other themes. How do I define the css code for a specific theme in the CSS snippets file?

4

Changes you make in Style Settings (if the theme supports it) are per theme. That would be the easiest.

Depending on the theme in question and what specifics you’d like to change, it should be possible to write some CSS only affecting that theme.

Another option that might be easier than making a lot of custom theme-specific snippets would be to make a copy of the theme, rename it, and add any extra CSS of you own to the bottom of the theme’s theme.css.

You’ll have to change a few lines in the manifest.json file, update the theme manually when there are updates and remember to keep your custom CSS at the bottom, but this seems doable and how I would probably do it.

5

Thank you for your patient reply! If you modify the theme.css and manifest.json files as you mentioned, will the customized css styles be reset or overwritten after updating the theme?

6

I just tried it to be sure :sweat_smile:. I used Minimal, but it can be any theme.

  1. Make a copy of .obsidian/themes/Minimal/
  2. Rename it → .obsidian/themes/MinimalME/
  3. In ../MinimalME/manifest.json change "name": "Minimal" → "name": "MinimalME"

Now you can add any of your own (non theme-specific) CSS to the bottom of MinimalME/theme.css and it won’t be overwritten when Minimal updates. Give it a try for yourself though.

7

Thank you very much! :stuck_out_tongue_winking_eye:

8

This topic was automatically closed 90 days after the last reply. New replies are no longer allowed.