California Coast Theme

Hello, everyone! You can now find California Coast listed under community themes. This theme started out as a set of snippets on top of the minimal theme. I’ve worked to make it more robust and less dependent on the hider and sliding panes plugins, though they are still recommended for a cleaner UI. Consider this theme beta at this point, and please submit any issues you encounter here on github:

Change log

  • 2020-12-26: Embeds boxicons—it is no longer required to install the icon font
  • 2021-01-12: Many miscellaneous updates, including better windows support


  1. Install the California Coast Settings plugin (listed in community plugins)

Recommended plugins


Hider Plugin Settings

To match the screenshots, use these settings:

  • Hide title bar: yes
  • Hide app ribbon: yes
  • Hide status bar: no
  • Hide scroll bars: yes
  • Hide tooltips: no
  • Hide instructions: no
  • Hide metadata: no

Sliding Panes Settings

To match the screenshots, use these settings:

  • Toggle sliding panes: yes
  • Leaf auto width: yes
  • Leaf rotated headers: yes
  • Swap rotated header direction: yes
  • Toggle stacking: yes
  • Spine width: 42


If you see any issue, or would like to contribute to this theme, please submit an issue or raise a PR.


This theme wouldn’t be possible without @kepano’s minimal theme


In all cases:

  1. Update the theme CSS
  2. Update the theme plugin

Translucency not working on Windows

Re-installing Obsidian has been known to help. Updating Obsidian via settings does not update electron, so it is important to update via the installer if you are experiencing issues with translucency.

Translucency makes Obsidian laggy

This is a known issue on Mac, and seems to be caused by electron. There is no known permanent fix for this, though refreshing Obsidian (cmd+r) helps.


This is the best the theme of 2020 for me, but I can’t find it in this page Best of 2020 voting thread (theme, plugin, graph & story)
I can vote for it in 2021 :joy:

Very nice! I installed this one immediately. Also not sure if it is common practice that I’m just not aware of, but I really like having the plugin to play with the settings. Very handy.

It missed the nomination phase, unfortunately, but yeah vote for it for the 2021 award!


This is the best theme, thank you so much for creating this.

Hello @mgmeyers

I spent more time with the theme and realised that this theme makes me no longer need the WYSIWYG release of obsidian, that’s amazing.

I’ve selected enhanced editor and enhanced preview typography in plugin settings and it looks beautiful. I’m facing 1 issue though. In Preview mode a lot of spacing is added before and after divider line as well as the headers.

Is there a way to make the spacing same as in Edit mode?

Edit Mode:

Preview Mode:

1 Like

Hi @tav! Yeah, this is easy to do with a snippet. I’ll look into making a theme setting to do this, but for now you can add this to a snippet and it’ll override the padding set by the theme:

.cc-pretty-preview .markdown-preview-section hr {
  margin-top: 0;
  margin-bottom: 0;

.cc-pretty-preview .markdown-preview-view h1 {
  margin-top: 0;
  margin-bottom: 0.25em;

.cc-pretty-preview .markdown-preview-view h2 {
  margin-top: 0;
  margin-bottom: 0.25em;

.cc-pretty-preview .markdown-preview-view h3 {
  margin-top: 0;
  margin-bottom: 0.25em;

.cc-pretty-preview .markdown-preview-view h4 {
  margin-top: 0;
  margin-bottom: 0.25em;

.cc-pretty-preview .markdown-preview-view h5 {
  margin-top: 0;
  margin-bottom: 0.25em;

.cc-pretty-preview .markdown-preview-view h6 {
  margin-top: 0;
  margin-bottom: 0.25em;
1 Like

This is gorgeous, thank you so much

Thanks, almost there.
Everything else is working as expected except the spacing before the *** divider.
What code can decrease that?

1 Like

Thanks @mgmeyers, this is a gorgeous theme!
Same as @tav I applied the snippet to override the padding.


I also ran into a bug with links to the Obsidian search.

For a future update, I’d also love the option to set the accent colour, just as in the minimal theme itself.

Thanks for the excellent work!

The theme looks quite well made but I tried it but got these boxes instead of different icons. I installed the plugin.

Did you install the Boxicon font as per instruct step 1?


I downloaded it and now it’s working fine! Thanks.


@tav Try adding this as well:

.cc-pretty-preview .markdown-preview-section div:not([data-tag-name^="h"]) + div[data-tag-name="hr"] > hr {
  margin-top: calc(var(--editor-line-height-rem) * -1);
1 Like

Thanks @selfire! Can you describe how to reproduce this issue with the magnifying glass background? I haven’t come across it yet.

Perfect Now. Thank you so much for making this amazing theme.

Here’s the code I used in Obsidian:
[Created TK notes](obsidian://search?vault=Vault&query=file:(TK))

I turned off all other plugins and snippets but the issue persists. Looking at it with the inspector, it points towards this line:

a[href*="obsidian://search"] {
    background-image: url(data:image/svg+xml,%3Csvg xmlns='' viewBox='0 0 1…,30,30S58.6,70,42,70S12,56.6,12,40S25.4,10,42,10z'%3E%3C/path%3E%3C/svg%3E);


It is no longer required to install the boxicon font. Be sure to update the theme and the plugin, and please let me know if you see any icon related issues.

Loving this theme. Going to use this thread, since it appears active, to ask a really basic question that has been perplexing me. I have not seen any plugin settings on any third-party plugins I’ve installed—whether an actual plugin or a community theme. What am I missing!?


Well! Some of the plugins have settings and some don’t, but you can see the plugin setting of the individual plugin by turning it on and then a button will appear in the left side of the settings.

1 Like