?

title-less callouts

I mentioned that one of the things I like about Obsidian is that I, as a person who is able and willing to mess around with code, can get things exactly how I want them. Well, here's an example of that.

Obsidian has a lovely little feature called callouts, which are basically a colorful box with a little header and a symbol from the Lucide icon library.[1] You can even define custom callouts, which I have done honestly probably too many times. Callouts are cute, they're fun, they're a huge part of why I made a theme that would adjust Obsidian's color scheme to match a given accent.

But the thing is, I don't use the titles. Most of my callouts are a single line thing I want in plain text, and once I have a little yellow lightbulb icon, I really don't need a placeholder "Idea" label.

The lovely thing about Obsidian is that, in addition to allowing you to write your own theme or use a theme someone else has written, you can write little bits of CSS (called "snippets") to adjust things even further. I have a bunch, including one that gets rid of callout titles.

A blue box with label 'info'
Here's the before
The same blue box, without the label
Here's the after

Here's the code I use:

.callout {
    display: flex;
    align-items: center;
    gap: 1em;
    border-radius: 0.5rem;
}

.callout-title-inner {
    display: none;
}
CSS

This lives in a file called title-less callouts.css in my snippets folder, and that's it! If I felt inclined, I could toggle it on and off from Obsidian's settings, under "Appearance" or just, you know, delete the file. It's a lovely way to make small adjustments, especially if you're using a theme that you didn't write yourself to your exact specifications.[2]


  1. Which I discovered through this and now use all the time for a bunch of random crap.
  2. Or if you have really weird tastes to which you don't want to subject other possible users of your theme.
no messages yet!