Inline CSS for a document

When working with CSS, it would useful to add the css o a page and have it rendered in preview. So I might add something like this to my file in edit mode:

h1 {color:red}

and then the page would render all h1’s with red color.

this is useful for prototyping CSS and one off scenarios at a file level.


Obsidian already supports this natively since version 0.9.18:

You can now give notes specific CSS classes using the front matter option cssclass. You can also specify multiple ones with the same syntax as tags and aliases, for example, cssclass: class1, class2. Combine this with custom CSS to selectively style notes.

It supports cssclasses yes, but often adding a snippet for a single document that needs custom styling adds to clutter and writing friction.

1 Like