Last active
August 19, 2025 10:35
-
-
Save onespaceman/c98baad0b42a887f134261aac4d83f9b to your computer and use it in GitHub Desktop.
silverbullet theme
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| html { | |
| --crust: #dce0e8; | |
| --mantle: #e6e9ef; | |
| --base: #eff1f5; | |
| --surface0: #ccd0da; | |
| --surface1: #bcc0cc; | |
| --surface2: #acb0be; | |
| --overlay0: #9ca0b0; | |
| --overlay1: #8c8fa1; | |
| --overlay2: #7c7f93; | |
| --subtext0: #6c6f85; | |
| --subtext1: #5c5f77; | |
| --text: #4c4f69; | |
| --lavender: #7287fd; | |
| --blue: #1e66f5; | |
| --sapphire: #209fb5; | |
| --sky: #04a5e5; | |
| --teal: #179299; | |
| --green: #40a02b; | |
| --yellow: #df8e1d; | |
| --peach: #fe640b; | |
| --maroon: #e64553; | |
| --red: #d20f39; | |
| --mauve: #8839ef; | |
| --pink: #ea76cb; | |
| --flamingo: #dd7878; | |
| --rosewater: #dc8a78; | |
| } | |
| html[data-theme="dark"] { | |
| --crust: #11111b; | |
| --mantle: #181825; | |
| --base: #1e1e2e; | |
| --surface0: #313244; | |
| --surface1: #45475a; | |
| --surface2: #585b70; | |
| --overlay0: #6c7086; | |
| --overlay1: #7f849c; | |
| --overlay2: #9399b2; | |
| --subtext0: #a6adc8; | |
| --subtext1: #bac2de; | |
| --text: #cdd6f4; | |
| --lavender: #b4befe; | |
| --blue: #89b4fa; | |
| --sapphire: #74c7ec; | |
| --sky: #89dceb; | |
| --teal: #94e2d5; | |
| --green: #a6e3a1; | |
| --yellow: #f9e2af; | |
| --peach: #fab387; | |
| --maroon: #eba0ac; | |
| --red: #f38ba8; | |
| --mauve: #cba6f7; | |
| --pink: #f5c2e7; | |
| --flamingo: #f2cdcd; | |
| --rosewater: #f5e0dc; | |
| } | |
| html, html[data-theme="dark"] { | |
| --root-background-color: var(--base); | |
| --root-color: var(--text); | |
| --ui-accent-color: var(--lavender); | |
| --highlight-color: color-mix(in srgb, var(--yellow), transparent 80%); | |
| --link-color: var(--lavender); | |
| --link-missing-color: var(--red); | |
| --meta-color: inherit; | |
| --meta-subtle-color: var(--subtext0); | |
| --subtle-color: var(--subtext1); | |
| --subtle-background-color: color-mix(in srgb, var(--surface1), transparent 80%); | |
| --top-color: inherit; | |
| --top-background-color: var(--crust); | |
| --top-border-color: var(--surface0); | |
| --top-sync-error-color: var(--red); | |
| --top-sync-error-background-color: var(--crust); | |
| --top-saved-color: var(--text); | |
| --top-unsaved-color: var(--subtext0); | |
| --top-loading-color: var(--overlay1); | |
| --panel-background-color: var(--base); | |
| --panel-border-color: var(--base); | |
| --bhs-background-color: var(--base); | |
| --bhs-border-color: var(--mantle); | |
| --modal-color: inherit; | |
| --modal-background-color: var(--base); | |
| --modal-border-color: var(--mantle); | |
| --modal-header-label-color: var(--ui-accent-color); | |
| --modal-help-background-color: var(--mantle); | |
| --modal-help-color: var(--subtext0); | |
| --modal-selected-option-background-color: var(--ui-accent-color); | |
| --modal-selected-option-color: var(--base); | |
| --modal-hint-background-color: var(--ui-accent-color); | |
| --modal-hint-color: var(--base); | |
| --modal-description-color: inherit; | |
| --notifications-background-color: inherit; | |
| --notifications-border-color: var(--surface0); | |
| --notification-info-background-color: color-mix(in srgb, var(--blue), #FFF 80%); | |
| --notification-error-background-color: color-mix(in srgb, var(--red), #FFF 80%); | |
| --action-button-background-color: transparent; | |
| --action-button-color: var(--text); | |
| --action-button-hover-color: var(--blue); | |
| --action-button-active-color: var(--blue); | |
| --editor-caret-color: var(--text); | |
| --editor-selection-background-color: color-mix(in srgb, var(--ui-accent-color), transparent 80%); | |
| --editor-panels-bottom-color: var(--subtext0); | |
| --editor-panels-bottom-background-color: var(--mantle); | |
| --editor-panels-bottom-border-color: var(--mantle); | |
| --editor-completion-detail-color: var(--subtext0); | |
| --editor-completion-detail-selected-color: var(--base); | |
| --editor-list-bullet-color: var(--text); | |
| --editor-heading-color: var(--text); | |
| --editor-heading-meta-color: var(--meta-subtle-color); | |
| --editor-hashtag-background-color: var(--ui-accent-color); | |
| --editor-hashtag-color: var(--base); | |
| --editor-hashtag-border-color: var(--ui-accent-color); | |
| --editor-ruler-color: var(--subtext0); | |
| --editor-code-color: var(--text); | |
| --editor-naked-url-color: var(--link-color); | |
| --editor-link-color: var(--link-color); | |
| --editor-link-url-color: var(--link-color); | |
| --editor-wiki-link-page-color: var(--link-color); | |
| --editor-wiki-link-page-background-color: transparent; | |
| --editor-wiki-link-page-missing-color: var(--link-missing-color); | |
| --editor-link-meta-color: var(--meta-subtle-color); | |
| --editor-named-anchor-color: var(--meta-subtle-color); | |
| --editor-command-button-color: inherit; | |
| --editor-command-button-background-color: var(--mantle); | |
| --editor-command-button-hover-background-color: inherit; | |
| --editor-command-button-meta-color: var(--meta-subtle-color); | |
| --editor-command-button-border-color: var(--crust); | |
| --editor-line-meta-color: var(--meta-subtle-color); | |
| --editor-meta-color: var(--meta-color); | |
| --editor-table-head-background-color: var(--text); | |
| --editor-table-head-color: var(--base); | |
| --editor-table-even-background-color: var(--mantle); | |
| --editor-blockquote-background-color: var(--subtle-background-color); | |
| --editor-blockquote-color: var(--subtle-color); | |
| --editor-blockquote-border-color: var(--text); | |
| --editor-code-background-color: var(--subtle-background-color); | |
| --editor-struct-color: var(--red); | |
| --editor-highlight-background-color: var(--highlight-color); | |
| --editor-code-comment-color: var(--overlay2); | |
| --editor-code-variable-color: var(--blue); | |
| --editor-code-typename-color: var(--yellow); | |
| --editor-code-string-color: var(--green); | |
| --editor-code-number-color: var(--peach); | |
| --editor-code-operator-color: var(--sky); | |
| --editor-code-info-color: var(--subtle-color); | |
| --editor-code-atom-color: var(--blue); | |
| --editor-admonition-note-border-color: var(--sapphire); | |
| --editor-admonition-note-background-color: color-mix(in srgb, var(--editor-admonition-note-border-color), transparent 90%); | |
| --editor-admonition-warning-border-color: var(--peach); | |
| --editor-admonition-warning-background-color: color-mix(in srgb, var(--editor-admonition-warning-background-color), transparent 90%); | |
| --editor-frontmatter-background-color: var(--subtle-background-color); | |
| --editor-frontmatter-color: var(--subtle-color); | |
| --editor-frontmatter-marker-color: var(--maroon); | |
| --editor-widget-background-color: var(--base); | |
| --editor-task-marker-color: var(--subtle-color); | |
| --editor-task-state-color: var(--subtle-color); | |
| --editor-directive-color: var(--text); | |
| --editor-directive-background-color: var(--subtle-background-color); | |
| --ui-font: "Iosevka", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, | |
| "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", | |
| "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; | |
| --editor-font: "Iosevka", "iA-Mono", "Menlo", "sans-serif"; | |
| --editor-width: 70em; | |
| } | |
| html[data-theme="dark"] { | |
| --notification-info-background-color: var(--blue); | |
| --notification-error-background-color: var(--red); | |
| --editor-completion-detail-selected-color: var(--text); | |
| } | |
| html[data-theme="dark"] .sb-notifications { color: var(--base);} | |
| html[data-theme="dark"] #sb-main .cm-editor .sb-highlight { | |
| color: var(--base); | |
| background-color: color-mix(in srgb, var(--yellow), transparent 20%); | |
| padding: 0px 5px; | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment