Hello guys, where i can find the default obsidian callout css snippet that i customize?
The CSS snippet will be located at /vault/.obsidian/snippets/snippets.css.
But it doesn’t exist by default (you must create it).
So - here is a simple way to CREATE your custom CSS snippet:
If you have any questions, feel free to ask 
The basic callout construction is some thing like this:
.callout[data-callout="callout type"] {
--callout-color: some-color;
--callout-icon: lucide-icon;
}
The data-callout attribute refers to the type of callout. By default, Obsidian has an info callout, a to-do callout, an example callout, etc. You can use this attribute to target a specific callout (like [data-callout="info"]) or create your own custom callout that you can then type into a note like a regular callout.
--callout-icon draws from lucide’s collection of icons. You can view these icons at lucide.dev. You may have to close the note and re-enter it several times to get the icon to change in preview view (it takes a while to load in sometimes). If you do change the icon, make sure you add lucide before the icon name (for example, lucide-pulse or lucide-check).
Or, if you want to target all callout types, you can use
.callout {
}
and put whatever you want in the brackets.
1 Like