Home

Awesome

Shimmering Focus ⟡

Download count Last commit

A minimalistic and opinionated Obsidian theme for the keyboard-centric user.
🏆 Winner Obsidian October 2022.

Promo Screenshot


<!-- toc --> <!-- tocstop -->

Design philosophy

Features

Commands

When the Style Settings Plugin is installed, Shimmering Focus adds commands for toggling theme features:

Customize colors

With Shimmering Focus, you can create your own color scheme with this CSS snippet. You are welcome to share your color scheme.

.theme-light.theme-light {
    --bg-hue: 230;
    --bg-sat: 25%;

    /* `--color-accent-hsl` should have the same values as `--color-accent` */
    --color-accent: hsl(184 79% 35%);
    --color-accent-hsl: 184, 79%, 35%;
    --interactive-accent: hsl(184 79% 30%);

    --alt-heading-color: hsl(232 34% 50%);
    --secondary-accent: hsl(28 54% 51%);
    --hover-accent: hsl(328 100% 54%);
    --link-unresolved-color: hsl(101 42% 51%);
}

.theme-dark.theme-dark {
    --bg-hue: 230;
    --bg-sat: 15%;

    /* Note that `--color-accent-hsl` should have the same values as `--color-accent` */
    --color-accent: hsl(184 79% 45%);
    --color-accent-hsl: 184, 79%, 35%;
    --interactive-accent: hsl(184 79% 30%);

    --alt-heading-color: hsl(232 50% 70%);
    --secondary-accent: hsl(28 63% 61%);
    --hover-accent: hsl(328 100% 64%);
	--link-unresolved-color: hsl(101 42% 51%);
}

/* Hide the background color settings since they are overwritten by the custom colors above */ 
.style-settings-container .setting-item:is([data-id="bg-hue-light"],[data-id="bg-hue-dark"]) {
	display: none;
}

Standalone snippets

Some features of this theme are available as standalone snippets. These can be found in the snippets directory.

<!-- vale Google.Will = NO -->

Contribute

Bug fixes, support for more plugins, or improvements for mobile are welcome. However, please ask before contributing entirely new features by creating a Draft PR or an issue.

All relevant source files are located in the source directory, and will be compiled via GitHub action when pushed to GitHub.

The theme uses lightning-css for syntax-lowering in its build. That means you can use modern CSS features like CSS-nesting, as the resulting theme.css will still be compatible with older Obsidian Installer versions that do not support nesting yet. Furthermore, this theme targets Obsidian installer version 1.1.9, so feel free to use :has().

The theme is written completely dependency-free in vanilla CSS.

Licenses

<!-- vale Google.FirstPerson = NO -->

Credits

Thanks

About the developer
In my day job, I am a sociologist studying the social mechanisms underlying the digital economy. For my PhD project, I investigate the governance of the app economy and how software ecosystems manage the tension between innovation and compatibility. If you are interested in this subject, feel free to get in touch.

[!IMPORTANT] For questions, feature requests, or bug reports, please file an issue via GitHub. Due to the number of messages I receive, I am not able to respond to inquiries made elsewhere.

<a href='https://ko-fi.com/Y8Y86SQ91' target='_blank'> <img height='36' style='border:0px;height:36px;' src='https://cdn.ko-fi.com/cdn/kofi1.png?v=3' border='0' alt='Buy Me a Coffee at ko-fi.com' /></a>