https://github.com/greetclammy/adapt-to-current-view
Custom plugin for Obsidian that allows to set different accent colors for Reading view, Live Preview and Source.
https://github.com/greetclammy/adapt-to-current-view
obsidian obsidian-community obsidian-md obsidian-plugin obsidianmd
Last synced: 2 months ago
JSON representation
Custom plugin for Obsidian that allows to set different accent colors for Reading view, Live Preview and Source.
- Host: GitHub
- URL: https://github.com/greetclammy/adapt-to-current-view
- Owner: greetclammy
- Created: 2025-08-01T19:29:32.000Z (2 months ago)
- Default Branch: main
- Last Pushed: 2025-08-01T21:23:17.000Z (2 months ago)
- Last Synced: 2025-08-01T21:44:40.451Z (2 months ago)
- Topics: obsidian, obsidian-community, obsidian-md, obsidian-plugin, obsidianmd
- Language: TypeScript
- Homepage:
- Size: 85.9 KB
- Stars: 1
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Adapt to Current View
Custom plugin for [Obsidian](https://obsidian.md/) that allows to set different accent colors for Reading view, Live Preview and Source.
I find that this works (and looks!) best with [Minimal Theme](https://minimal.guide/)’s Undeline tab style (shown below), which can be enabled in its *[Style Settings](https://obsidian.md/plugins?id=obsidian-style-settings)*, and with _Colorful active states_, which can be enabled in *[Minimal Theme Settings](https://obsidian.md/plugins?id=obsidian-minimal-settings)*.
Mobile app overview
## ⚙️ Settings page overview
Screenshot
## ✅ Installation
1. Install the community plugin [BRAT](https://obsidian.md/plugins?id=obsidian42-brat).
2. Go to the BRAT settings.
3. Press "Add Beta Plugin".
3. Paste the following URL in the text field: https://github.com/greetclammy/adapt-to-current-view.
4. Select the latest release.
5. Make sure that "Enable after installing the plugin" is checked.
6. Press "Add Plugin".
## 🖼️ Optional CSS snippets
### Hide border under Minimal Theme's _Underline_ tabs
For a cleaner look. Shown in the screenshot above. Best paired with _Workspace borders_ toggled OFF in _Minimal Theme Settings_.
CSS snippet
```css
body.theme-light.tabs-underline .mod-root .workspace-tab-header-container,
body.theme-dark.tabs-underline .mod-root .workspace-tab-header-container {
border-bottom: none !important;
}
body.theme-light.tabs-underline .mod-left-split .workspace-tab-header-container,
body.theme-dark.tabs-underline .mod-left-split .workspace-tab-header-container {
border-bottom: none !important;
}
body.theme-light.tabs-underline .mod-right-split .workspace-tab-header-container,
body.theme-dark.tabs-underline .mod-right-split .workspace-tab-header-container {
border-bottom: none !important;
}
body.theme-light.tabs-underline .workspace-tab-header-container,
body.theme-dark.tabs-underline .workspace-tab-header-container {
border-bottom: none !important;
}
body.theme-light.tabs-underline .workspace-tab-header,
body.theme-dark.tabs-underline .workspace-tab-header {
border-bottom-width: 2px;
}
```
### Default theme tag appearance for Minimal Theme
CSS snippet
```css
body:not(.minimal-unstyled-tags),
.theme-dark body:not(.minimal-unstyled-tags) {
--tag-background: hsla(var(--accent-h), var(--accent-s), var(--accent-l), 0.1) !important;
--tag-background-hover: hsla(var(--accent-h), var(--accent-s), var(--accent-l), 0.2) !important;
--tag-color: var(--interactive-accent) !important;
--tag-color-hover: var(--interactive-accent) !important;
}
.tag:not(.token) {
background-color: var(--tag-background) !important;
color: var(--tag-color) !important;
}
.tag:not(.token):hover {
background-color: var(--tag-background-hover) !important;
color: var(--tag-color-hover) !important;
}
.markdown-source-view.mod-cm6 .cm-hashtag {
color: var(--tag-color) !important;
background-color: var(--tag-background) !important;
}
```
## 💬 Discuss
Feel free to share your thoughts about this plugin on:
- [The Obsidian Forum](https://forum.obsidian.md/t/plugin-to-asign-different-accent-colors-for-reading-view-live-preview-and-source-view/90504)
- [The Obsidian Members Group (OMG) Discord channel](https://discord.com/channels/686053708261228577/707816848615407697)
- [GitHub discussions](https://github.com/greetclammy/adapt-to-current-view/discussions)
Or open an issue!
## 👨💻 What else I made
- [First Line is title](https://github.com/greetclammy/first-line-is-title)
Please ⭐️ this repository if you found the plugin helpful 😇