Compare commits

...

9 commits
3.3.0 ... main

Author SHA1 Message Date
github-actions[bot]
4246c4f6f1 Sync HearthCode 3.7.4 2026-07-15 08:47:38 +00:00
github-actions[bot]
0d6006a974 Sync HearthCode 3.7.3 2026-07-14 07:22:32 +00:00
github-actions[bot]
761500494b Sync HearthCode 3.7.2 2026-07-14 01:18:44 +00:00
github-actions[bot]
9b233a274e Sync HearthCode 3.7.1 2026-07-13 13:03:16 +00:00
github-actions[bot]
08e95838af Sync HearthCode 3.7.0 2026-07-09 14:02:38 +00:00
github-actions[bot]
2b2aa47594 Sync HearthCode 3.6.0 2026-07-04 04:48:59 +00:00
github-actions[bot]
fac4b02ecf Sync HearthCode 3.5.0 2026-06-24 02:22:18 +00:00
Mark Y.
05e97644ab Sync HearthCode 3.4.1 2026-06-22 13:59:55 +09:00
Mark Y.
1cac0d16f2 Sync HearthCode 3.4.0 2026-06-18 19:51:15 +09:00
6 changed files with 149 additions and 83 deletions

View file

@ -1,11 +1,23 @@
# HearthCode for Obsidian # HearthCode for Obsidian
Warm, calm dark and light themes for [Obsidian](https://obsidian.md), built from the HearthCode color system. The same color language applied to functional Markdown — typed callouts, task states, layered lists, flat code and quote surfaces, and tag pills, kept consistent across edit and reading views. Warm, calm Dark and Light themes for [Obsidian](https://obsidian.md), designed to make structured notes easy to scan without making the page noisy.
![HearthCode for Obsidian](./hero.png) ![HearthCode for Obsidian](./hero.png)
- **Modes:** Dark and Light ## Built for notes with structure
- **Homepage:** https://theme.hearthcode.dev
- Typed callouts keep notes, tips, questions, warnings, and danger states distinct.
- Task states, layered list markers, tag pills, code blocks, and quotes form a clear reading hierarchy.
- Edit and reading views share the same treatment, so a note does not change character when you switch modes.
- Dark and Light use the same semantic color language.
## Make it yours with Style Settings
With the optional **Style Settings** plugin, you can tune the parts that should be personal without breaking the calibrated palette:
- Typography: monospace notes, upright code-comment italics, and readable line length.
- Callout intensity: Quiet, Medium, or Bold.
- Accent: Moss, Amber, or Slate, each checked for text contrast.
## Install ## Install
@ -20,13 +32,11 @@ Warm, calm dark and light themes for [Obsidian](https://obsidian.md), built from
2. Copy them into `<your-vault>/.obsidian/themes/HearthCode/`. 2. Copy them into `<your-vault>/.obsidian/themes/HearthCode/`.
3. In **Settings → Appearance → Themes**, select **HearthCode**. 3. In **Settings → Appearance → Themes**, select **HearthCode**.
## About this repository Homepage and editor-theme previews: <https://theme.hearthcode.dev>
This repo is the Obsidian **publish target** for HearthCode. Everything here ## Source and support
(`manifest.json`, `theme.css`, `versions.json`, `screenshot.png`, `hero.png`,
and this `README.md`) is generated and synced from the source-of-truth monorepo, This repository is the generated Obsidian publish target. Source, issues, and changes live in [hearth-code/HearthTheme](https://github.com/hearth-code/HearthTheme).
[hearth-code/HearthTheme](https://github.com/hearth-code/HearthTheme) — don't
edit it here. Please file issues and changes against that repository.
## License ## License

BIN
hero.png

Binary file not shown.

Before

Width:  |  Height:  |  Size: 152 KiB

After

Width:  |  Height:  |  Size: 152 KiB

View file

@ -1,6 +1,6 @@
{ {
"name": "HearthCode", "name": "HearthCode",
"version": "3.3.0", "version": "3.7.4",
"minAppVersion": "1.0.0", "minAppVersion": "1.0.0",
"author": "HearthCode", "author": "HearthCode",
"authorUrl": "https://theme.hearthcode.dev" "authorUrl": "https://theme.hearthcode.dev"

Binary file not shown.

Before

Width:  |  Height:  |  Size: 33 KiB

After

Width:  |  Height:  |  Size: 33 KiB

191
theme.css
View file

@ -29,20 +29,42 @@ settings:
max: 90 max: 90
step: 1 step: 1
format: 'rem' format: 'rem'
- id: 'hearthcode-callouts'
title: 'Callouts'
type: 'heading'
level: 1
- id: 'hearth-callout-bg-opacity'
title: 'Callout background'
description: 'How strongly callout backgrounds are tinted. Quiet is subtle; bold is more saturated. Medium is the theme default.'
type: 'variable-select'
default: '0.11'
options:
- label: 'Quiet'
value: '0.07'
- label: 'Medium'
value: '0.11'
- label: 'Bold'
value: '0.16'
- id: 'hearthcode-accent'
title: 'Accent'
type: 'heading'
level: 1
- id: 'hearthcode-accent-preset'
title: 'Accent color'
description: 'Swap the accent (links, active controls, buttons) for a contrast-vetted preset. Moss is the default sage; Amber is warm; Slate is cool. Every preset keeps button and link text at AA 4.5:1.'
type: 'class-select'
allowEmpty: false
default: 'hearthcode-accent-moss'
options:
- label: 'Moss (default)'
value: 'hearthcode-accent-moss'
- label: 'Amber'
value: 'hearthcode-accent-amber'
- label: 'Slate'
value: 'hearthcode-accent-slate'
*/ */
/* Style Settings overrides (consumed by the @settings toggles above). */
body.hearthcode-mono-notes {
--font-text: var(--font-monospace);
}
body.hearthcode-no-italics .cm-s-obsidian span.cm-comment,
body.hearthcode-no-italics .markdown-source-view.mod-cm6 .cm-line .cm-comment {
font-style: normal;
}
.theme-dark { .theme-dark {
--background-modifier-active-hover: #3a362e; --background-modifier-active-hover: #3a362e;
--background-modifier-border: #3c3a32; --background-modifier-border: #3c3a32;
@ -71,7 +93,7 @@ body.hearthcode-no-italics .markdown-source-view.mod-cm6 .cm-line .cm-comment {
--callout-content-padding: 0.48em 0 0; --callout-content-padding: 0.48em 0 0;
--callout-default: 104, 173, 193; --callout-default: 104, 173, 193;
--callout-error: 224, 108, 94; --callout-error: 224, 108, 94;
--callout-example: 136, 162, 201; --callout-example: 140, 161, 199;
--callout-fail: 224, 108, 94; --callout-fail: 224, 108, 94;
--callout-info: 104, 173, 193; --callout-info: 104, 173, 193;
--callout-padding: 0.72em 0.9em; --callout-padding: 0.72em 0.9em;
@ -94,7 +116,7 @@ body.hearthcode-no-italics .markdown-source-view.mod-cm6 .cm-line .cm-comment {
--checklist-done-decoration: line-through; --checklist-done-decoration: line-through;
--code-background: var(--hearth-md-code-surface); --code-background: var(--hearth-md-code-surface);
--code-comment: #817566; --code-comment: #817566;
--code-function: #91cf72; --code-function: #93ce75;
--code-important: #68adc1; --code-important: #68adc1;
--code-keyword: #d4b84f; --code-keyword: #d4b84f;
--code-normal: #c3bfb9; --code-normal: #c3bfb9;
@ -104,7 +126,7 @@ body.hearthcode-no-italics .markdown-source-view.mod-cm6 .cm-line .cm-comment {
--code-tag: #c5bf56; --code-tag: #c5bf56;
--code-value: #77a7d2; --code-value: #77a7d2;
--h1-color: #d4b84f; --h1-color: #d4b84f;
--h2-color: #91cf72; --h2-color: #93ce75;
--h3-color: #8ebb7f; --h3-color: #8ebb7f;
--h4-color: #caa46c; --h4-color: #caa46c;
--h5-color: #77a7d2; --h5-color: #77a7d2;
@ -130,7 +152,7 @@ body.hearthcode-no-italics .markdown-source-view.mod-cm6 .cm-line .cm-comment {
--hearth-md-code-surface: rgb(38 39 35 / 0.9); --hearth-md-code-surface: rgb(38 39 35 / 0.9);
--hearth-md-inline-code: #9bb0bf; --hearth-md-inline-code: #9bb0bf;
--hearth-md-list-level-1: #858b6e; --hearth-md-list-level-1: #858b6e;
--hearth-md-list-level-2: #858e69; --hearth-md-list-level-2: #868e6a;
--hearth-md-list-level-3: #7e8486; --hearth-md-list-level-3: #7e8486;
--hearth-md-surface: rgb(37 38 34 / 0.88); --hearth-md-surface: rgb(37 38 34 / 0.88);
--hearth-md-surface-muted: rgb(34 35 32 / 0.72); --hearth-md-surface-muted: rgb(34 35 32 / 0.72);
@ -169,14 +191,14 @@ body.hearthcode-no-italics .markdown-source-view.mod-cm6 .cm-line .cm-comment {
--hr-color: rgb(60 58 50 / 0.7); --hr-color: rgb(60 58 50 / 0.7);
--interactive-accent: #8bb49e; --interactive-accent: #8bb49e;
--interactive-accent-hover: #98b69f; --interactive-accent-hover: #98b69f;
--interactive-hover: #2a2722; --interactive-hover: #2a2723;
--interactive-normal: rgb(60 58 50 / 0.2); --interactive-normal: rgb(60 58 50 / 0.2);
--link-color: #8bb49e; --link-color: var(--interactive-accent);
--link-color-hover: #98b69f; --link-color-hover: var(--interactive-accent-hover);
--link-unresolved-color: #938461; --link-unresolved-color: #938461;
--list-marker-color: #858b6e; --list-marker-color: #858b6e;
--list-marker-color-collapsed: #8bb49e; --list-marker-color-collapsed: var(--interactive-accent);
--list-marker-color-hover: #858e69; --list-marker-color-hover: #868e6a;
--list-spacing: 0.14em; --list-spacing: 0.14em;
--scrollbar-active-thumb-bg: rgb(95 88 76 / 0.85); --scrollbar-active-thumb-bg: rgb(95 88 76 / 0.85);
--scrollbar-bg: transparent; --scrollbar-bg: transparent;
@ -187,8 +209,8 @@ body.hearthcode-no-italics .markdown-source-view.mod-cm6 .cm-line .cm-comment {
--tag-background-hover: rgb(104 173 193 / 0.22); --tag-background-hover: rgb(104 173 193 / 0.22);
--tag-color: #68adc1; --tag-color: #68adc1;
--tag-color-hover: #d2bea2; --tag-color-hover: #d2bea2;
--text-accent: #8bb49e; --text-accent: var(--interactive-accent);
--text-accent-hover: #98b69f; --text-accent-hover: var(--interactive-accent-hover);
--text-error: #e06c5e; --text-error: #e06c5e;
--text-faint: #685f52; --text-faint: #685f52;
--text-highlight-bg: rgb(203 147 34 / 0.34); --text-highlight-bg: rgb(203 147 34 / 0.34);
@ -703,11 +725,6 @@ body.hearthcode-no-italics .markdown-source-view.mod-cm6 .cm-line .cm-comment {
background-color: var(--background-modifier-active-hover); background-color: var(--background-modifier-active-hover);
} }
.theme-dark .cm-active,
.theme-dark .markdown-source-view.mod-cm6 .cm-active.cm-line {
background-color: var(--background-modifier-hover);
}
.theme-dark .status-bar-item:hover { .theme-dark .status-bar-item:hover {
background-color: var(--background-modifier-hover); background-color: var(--background-modifier-hover);
} }
@ -745,15 +762,15 @@ body.hearthcode-no-italics .markdown-source-view.mod-cm6 .cm-line .cm-comment {
--background-modifier-form-field: rgb(195 192 181 / 0.22); --background-modifier-form-field: rgb(195 192 181 / 0.22);
--background-modifier-hover: #c7c4b8; --background-modifier-hover: #c7c4b8;
--background-modifier-message: rgb(72 106 89 / 0.18); --background-modifier-message: rgb(72 106 89 / 0.18);
--background-modifier-success: rgb(117 104 35 / 0.24); --background-modifier-success: rgb(126 90 42 / 0.24);
--background-primary: #e7e5d8; --background-primary: #e7e5d8;
--background-primary-alt: #cecabe; --background-primary-alt: #cecabe;
--background-secondary: #d4d1c4; --background-secondary: #d4d1c4;
--background-secondary-alt: #bdb9ad; --background-secondary-alt: #bdb9ad;
--blockquote-background-color: var(--hearth-md-surface-muted); --blockquote-background-color: var(--hearth-md-surface-muted);
--blockquote-border-color: rgb(76 113 67 / 0.68); --blockquote-border-color: rgb(84 113 73 / 0.68);
--blockquote-border-thickness: 3px; --blockquote-border-thickness: 3px;
--blockquote-color: #605950; --blockquote-color: #665d54;
--callout-border-opacity: 0.5; --callout-border-opacity: 0.5;
--callout-border-width: 1px; --callout-border-width: 1px;
--callout-bug: 186, 81, 70; --callout-bug: 186, 81, 70;
@ -761,44 +778,44 @@ body.hearthcode-no-italics .markdown-source-view.mod-cm6 .cm-line .cm-comment {
--callout-content-padding: 0.48em 0 0; --callout-content-padding: 0.48em 0 0;
--callout-default: 35, 114, 150; --callout-default: 35, 114, 150;
--callout-error: 186, 81, 70; --callout-error: 186, 81, 70;
--callout-example: 74, 108, 159; --callout-example: 58, 102, 155;
--callout-fail: 186, 81, 70; --callout-fail: 186, 81, 70;
--callout-info: 35, 114, 150; --callout-info: 35, 114, 150;
--callout-padding: 0.72em 0.9em; --callout-padding: 0.72em 0.9em;
--callout-question: 164, 105, 44; --callout-question: 164, 105, 44;
--callout-quote: 135, 129, 119; --callout-quote: 142, 134, 123;
--callout-radius: 8px; --callout-radius: 8px;
--callout-success: 57, 118, 37; --callout-success: 57, 118, 37;
--callout-tip: 57, 118, 37; --callout-tip: 57, 118, 37;
--callout-todo: 59, 109, 111; --callout-todo: 59, 109, 111;
--callout-warning: 157, 113, 36; --callout-warning: 157, 113, 36;
--checkbox-border-color: rgb(100 112 87 / 0.68); --checkbox-border-color: rgb(109 116 92 / 0.68);
--checkbox-border-color-hover: rgb(91 110 88 / 0.86); --checkbox-border-color-hover: rgb(97 113 91 / 0.86);
--checkbox-color: #457d31; --checkbox-color: #457d31;
--checkbox-color-hover: #445f50; --checkbox-color-hover: #445f50;
--checkbox-margin-inline-start: 0; --checkbox-margin-inline-start: 0;
--checkbox-marker-color: #faf5ef; --checkbox-marker-color: #faf5ef;
--checkbox-radius: 4px; --checkbox-radius: 4px;
--checkbox-size: 15px; --checkbox-size: 15px;
--checklist-done-color: #676058; --checklist-done-color: #6f665b;
--checklist-done-decoration: line-through; --checklist-done-decoration: line-through;
--code-background: var(--hearth-md-code-surface); --code-background: var(--hearth-md-code-surface);
--code-comment: #766f65; --code-comment: #7f766a;
--code-function: #397626; --code-function: #3e752b;
--code-important: #237296; --code-important: #237296;
--code-keyword: #83640f; --code-keyword: #83640f;
--code-normal: #46423d; --code-normal: #46423d;
--code-operator: #66635d; --code-operator: #5f5c57;
--code-property: #3f7138; --code-property: #46703f;
--code-string: #756823; --code-string: #7e5a2a;
--code-tag: #7f7d2e; --code-tag: #5f6b24;
--code-value: #346fa8; --code-value: #1768a6;
--h1-color: #83640f; --h1-color: #83640f;
--h2-color: #397626; --h2-color: #3e752b;
--h3-color: #3f7138; --h3-color: #46703f;
--h4-color: #756823; --h4-color: #7e5a2a;
--h5-color: #346fa8; --h5-color: #1768a6;
--h6-color: #5c554d; --h6-color: #615950;
--hearth-accent-hover: #bb7e16; --hearth-accent-hover: #bb7e16;
--hearth-bracket-bright: #855a70; --hearth-bracket-bright: #855a70;
--hearth-bracket-cool: #237296; --hearth-bracket-cool: #237296;
@ -814,14 +831,14 @@ body.hearthcode-no-italics .markdown-source-view.mod-cm6 .cm-line .cm-comment {
--hearth-guide-active: #8b7d63; --hearth-guide-active: #8b7d63;
--hearth-guide-ink: #7c5f34; --hearth-guide-ink: #7c5f34;
--hearth-md-block-gap: 1em; --hearth-md-block-gap: 1em;
--hearth-md-border: rgb(178 174 163 / 0.54); --hearth-md-border: rgb(180 176 165 / 0.54);
--hearth-md-border-soft: rgb(178 174 163 / 0.28); --hearth-md-border-soft: rgb(180 176 165 / 0.28);
--hearth-md-code-border: rgb(178 174 163 / 0.42); --hearth-md-code-border: rgb(180 176 165 / 0.42);
--hearth-md-code-surface: rgb(209 205 193 / 0.9); --hearth-md-code-surface: rgb(209 205 193 / 0.9);
--hearth-md-inline-code: #345575; --hearth-md-inline-code: #235074;
--hearth-md-list-level-1: #647057; --hearth-md-list-level-1: #6d745c;
--hearth-md-list-level-2: #657153; --hearth-md-list-level-2: #6d7658;
--hearth-md-list-level-3: #626f79; --hearth-md-list-level-3: #60727c;
--hearth-md-surface: rgb(211 207 195 / 0.88); --hearth-md-surface: rgb(211 207 195 / 0.88);
--hearth-md-surface-muted: rgb(217 213 201 / 0.72); --hearth-md-surface-muted: rgb(217 213 201 / 0.72);
--hearth-nav-active-ink: #2c2722; --hearth-nav-active-ink: #2c2722;
@ -830,8 +847,8 @@ body.hearthcode-no-italics .markdown-source-view.mod-cm6 .cm-line .cm-comment {
--hearth-task-background: rgb(215 211 199 / 0.9); --hearth-task-background: rgb(215 211 199 / 0.9);
--hearth-task-cancelled: #ba5146; --hearth-task-cancelled: #ba5146;
--hearth-task-cancelled-text: #7c4038; --hearth-task-cancelled-text: #7c4038;
--hearth-task-deferred: #6b645b; --hearth-task-deferred: #736a5f;
--hearth-task-deferred-text: #605950; --hearth-task-deferred-text: #665d54;
--hearth-task-done: #457d31; --hearth-task-done: #457d31;
--hearth-task-important: #9d7124; --hearth-task-important: #9d7124;
--hearth-task-important-text: #735626; --hearth-task-important-text: #735626;
@ -859,26 +876,26 @@ body.hearthcode-no-italics .markdown-source-view.mod-cm6 .cm-line .cm-comment {
--hr-color: rgb(195 192 181 / 0.7); --hr-color: rgb(195 192 181 / 0.7);
--interactive-accent: #486a59; --interactive-accent: #486a59;
--interactive-accent-hover: #445f50; --interactive-accent-hover: #445f50;
--interactive-hover: #cac7b9; --interactive-hover: #cac7bb;
--interactive-normal: rgb(195 192 181 / 0.2); --interactive-normal: rgb(195 192 181 / 0.2);
--link-color: #486a59; --link-color: var(--interactive-accent);
--link-color-hover: #445f50; --link-color-hover: var(--interactive-accent-hover);
--link-unresolved-color: #796d52; --link-unresolved-color: #807256;
--list-marker-color: #647057; --list-marker-color: #6d745c;
--list-marker-color-collapsed: #486a59; --list-marker-color-collapsed: var(--interactive-accent);
--list-marker-color-hover: #657153; --list-marker-color-hover: #6d7658;
--list-spacing: 0.14em; --list-spacing: 0.14em;
--scrollbar-active-thumb-bg: rgb(157 152 141 / 0.85); --scrollbar-active-thumb-bg: rgb(161 155 144 / 0.85);
--scrollbar-bg: transparent; --scrollbar-bg: transparent;
--scrollbar-thumb-bg: rgb(172 168 157 / 0.5); --scrollbar-thumb-bg: rgb(175 170 159 / 0.5);
--table-border-color: rgb(195 192 181 / 0.58); --table-border-color: rgb(195 192 181 / 0.58);
--table-header-border-color: rgb(195 192 181 / 0.76); --table-header-border-color: rgb(195 192 181 / 0.76);
--tag-background: rgb(35 114 150 / 0.14); --tag-background: rgb(35 114 150 / 0.14);
--tag-background-hover: rgb(35 114 150 / 0.22); --tag-background-hover: rgb(35 114 150 / 0.22);
--tag-color: #237296; --tag-color: #237296;
--tag-color-hover: #342d28; --tag-color-hover: #342d28;
--text-accent: #486a59; --text-accent: var(--interactive-accent);
--text-accent-hover: #445f50; --text-accent-hover: var(--interactive-accent-hover);
--text-error: #ba5146; --text-error: #ba5146;
--text-faint: #7f7a71; --text-faint: #7f7a71;
--text-highlight-bg: rgb(184 121 17 / 0.34); --text-highlight-bg: rgb(184 121 17 / 0.34);
@ -1393,11 +1410,6 @@ body.hearthcode-no-italics .markdown-source-view.mod-cm6 .cm-line .cm-comment {
background-color: var(--background-modifier-active-hover); background-color: var(--background-modifier-active-hover);
} }
.theme-light .cm-active,
.theme-light .markdown-source-view.mod-cm6 .cm-active.cm-line {
background-color: var(--background-modifier-hover);
}
.theme-light .status-bar-item:hover { .theme-light .status-bar-item:hover {
background-color: var(--background-modifier-hover); background-color: var(--background-modifier-hover);
} }
@ -1422,3 +1434,38 @@ body.hearthcode-no-italics .markdown-source-view.mod-cm6 .cm-line .cm-comment {
.theme-light ::-webkit-scrollbar-thumb:active { .theme-light ::-webkit-scrollbar-thumb:active {
background-color: var(--scrollbar-active-thumb-bg); background-color: var(--scrollbar-active-thumb-bg);
} }
/* Style Settings overrides (consumed by the @settings controls above). */
body.hearthcode-mono-notes {
--font-text: var(--font-monospace);
}
body.hearthcode-no-italics .cm-s-obsidian span.cm-comment,
body.hearthcode-no-italics .markdown-source-view.mod-cm6 .cm-line .cm-comment {
font-style: normal;
}
body.hearthcode-accent-amber.theme-dark {
--interactive-accent: #e6b84f;
--interactive-accent-hover: #edc265;
--text-on-accent: #191815;
}
body.hearthcode-accent-amber.theme-light {
--interactive-accent: #845812;
--interactive-accent-hover: #6f4a0e;
--text-on-accent: #faf5ef;
}
body.hearthcode-accent-slate.theme-dark {
--interactive-accent: #82b8e0;
--interactive-accent-hover: #90c0e6;
--text-on-accent: #191815;
}
body.hearthcode-accent-slate.theme-light {
--interactive-accent: #2d5688;
--interactive-accent-hover: #264c74;
--text-on-accent: #faf5ef;
}

View file

@ -32,5 +32,14 @@
"3.1.3": "1.0.0", "3.1.3": "1.0.0",
"3.1.4": "1.0.0", "3.1.4": "1.0.0",
"3.2.0": "1.0.0", "3.2.0": "1.0.0",
"3.3.0": "1.0.0" "3.3.0": "1.0.0",
"3.4.0": "1.0.0",
"3.4.1": "1.0.0",
"3.5.0": "1.0.0",
"3.6.0": "1.0.0",
"3.7.0": "1.0.0",
"3.7.1": "1.0.0",
"3.7.2": "1.0.0",
"3.7.3": "1.0.0",
"3.7.4": "1.0.0"
} }