fyaic_DIDADI-obsidian-theme/theme.css

/*
DIDADI
Version 1.0.0

An independent Obsidian theme for the DIDADI vault style.
No dependency on other themes, plugins, snippets, remote assets, or external fonts.
*/

body {
  --didadi-heading-color: #F25D2E;
  --didadi-accent: #ff5900;
  --didadi-accent-hover: #d94a00;
  --didadi-accent-soft: rgba(255, 89, 0, 0.14);
  --accent-h: 21;
  --accent-s: 100%;
  --accent-l: 50%;
  --color-accent-hsl: var(--accent-h), var(--accent-s), var(--accent-l);
  --color-accent: var(--didadi-accent);
  --color-accent-1: #ff6d22;
  --color-accent-2: var(--didadi-accent-hover);

  --font-text-theme: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    "Helvetica Neue", Arial, sans-serif;
  --font-interface-theme: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    "Helvetica Neue", Arial, sans-serif;
  --font-monospace-theme: "JetBrains Mono", "Fira Code", Consolas,
    "SFMono-Regular", Menlo, monospace;

  --font-text-size: 16px;
  --line-height-normal: 1.65;
  --line-width: 42rem;

  --h1-color: var(--didadi-heading-color);
  --h2-color: var(--didadi-heading-color);
  --h3-color: var(--didadi-heading-color);
  --h4-color: var(--didadi-heading-color);
  --h5-color: var(--didadi-heading-color);
  --h6-color: var(--didadi-heading-color);

  --h1-size: 1.8em;
  --h2-size: 1.55em;
  --h3-size: 1.32em;
  --h4-size: 1.15em;
  --h5-size: 1.02em;
  --h6-size: 0.92em;

  --h1-weight: 750;
  --h2-weight: 720;
  --h3-weight: 700;
  --h4-weight: 680;
  --h5-weight: 660;
  --h6-weight: 640;

  --h1-line-height: 1.2;
  --h2-line-height: 1.25;
  --h3-line-height: 1.3;
  --h4-line-height: 1.35;
  --h5-line-height: 1.4;
  --h6-line-height: 1.4;

  --h1-style: normal;
  --h2-style: normal;
  --h3-style: normal;
  --h4-style: normal;
  --h5-style: normal;
  --h6-style: normal;

  --h1-variant: normal;
  --h2-variant: normal;
  --h3-variant: normal;
  --h4-variant: normal;
  --h5-variant: normal;
  --h6-variant: normal;

  --h1-text-transform: none;
  --h2-text-transform: none;
  --h3-text-transform: none;
  --h4-text-transform: none;
  --h5-text-transform: none;
  --h6-text-transform: none;

  --link-color: var(--didadi-accent);
  --link-color-hover: var(--didadi-accent-hover);
  --link-external-color: var(--didadi-accent);
  --link-external-color-hover: var(--didadi-accent-hover);
  --text-accent: var(--didadi-accent);
  --text-accent-hover: var(--didadi-accent-hover);

  --interactive-accent: var(--didadi-accent);
  --interactive-accent-hover: var(--didadi-accent-hover);
  --checkbox-color: var(--didadi-accent);
  --checkbox-color-hover: var(--didadi-accent-hover);
  --tag-radius: 999px;
  --tab-radius-active: 6px 6px 0 0;
  --radius-s: 4px;
  --radius-m: 6px;
  --radius-l: 8px;
}

.theme-light {
  color-scheme: light;
  --background-primary: #fbfbfa;
  --background-secondary: #f2f1ef;
  --background-secondary-alt: #ebe9e6;
  --background-modifier-border: #dedbd6;
  --background-modifier-hover: #f0ede9;
  --background-modifier-active-hover: #e9e4df;
  --text-normal: #222222;
  --text-muted: #66625c;
  --text-faint: #8c8780;
  --text-selection: rgba(255, 89, 0, 0.16);
  --text-highlight-bg: rgba(255, 202, 62, 0.38);
  --titlebar-background: #f2f1ef;
  --titlebar-background-focused: #fbfbfa;
  --ribbon-background: #f2f1ef;
  --code-background: #f0ede9;
  --tag-background: rgba(255, 89, 0, 0.12);
  --tag-color: #a63700;
}

.theme-dark {
  color-scheme: dark;
  --background-primary: #1d1d1b;
  --background-secondary: #262521;
  --background-secondary-alt: #302e29;
  --background-modifier-border: #3a3732;
  --background-modifier-hover: #2f2d28;
  --background-modifier-active-hover: #39362f;
  --text-normal: #e8e3dc;
  --text-muted: #b7b0a7;
  --text-faint: #8f877d;
  --text-selection: rgba(255, 89, 0, 0.28);
  --text-highlight-bg: rgba(255, 202, 62, 0.28);
  --titlebar-background: #262521;
  --titlebar-background-focused: #1d1d1b;
  --ribbon-background: #262521;
  --code-background: #302e29;
  --tag-background: rgba(255, 89, 0, 0.22);
  --tag-color: #ffb092;
}

.markdown-rendered h1,
.markdown-rendered h2,
.markdown-rendered h3,
.markdown-rendered h4,
.markdown-rendered h5,
.markdown-rendered h6,
.HyperMD-header-1,
.HyperMD-header-2,
.HyperMD-header-3,
.HyperMD-header-4,
.HyperMD-header-5,
.HyperMD-header-6,
.cm-header-1,
.cm-header-2,
.cm-header-3,
.cm-header-4,
.cm-header-5,
.cm-header-6 {
  color: var(--didadi-heading-color);
  letter-spacing: 0;
}

.markdown-rendered h1,
.markdown-rendered h2,
.markdown-rendered h3 {
  margin-top: 1.5em;
  margin-bottom: 0.65em;
}

.markdown-rendered h4,
.markdown-rendered h5,
.markdown-rendered h6 {
  margin-top: 1.15em;
  margin-bottom: 0.5em;
}

.markdown-source-view.mod-cm6 .cm-content,
.markdown-rendered {
  line-height: var(--line-height-normal);
}

.markdown-rendered blockquote {
  border-inline-start-color: var(--didadi-accent);
  background-color: var(--didadi-accent-soft);
  border-radius: var(--radius-m);
  padding: 0.65em 0.9em;
}

.callout {
  border-radius: var(--radius-l);
}

.callout[data-callout] {
  --callout-color: 255, 89, 0;
}

.markdown-rendered mark,
.cm-highlight {
  border-radius: 3px;
  padding: 0 0.12em;
}

.tag {
  border: 1px solid rgba(255, 89, 0, 0.24);
}

.nav-file-title.is-active,
.nav-folder-title.is-active {
  color: var(--didadi-accent);
}

button.mod-cta,
.modal button.mod-cta {
  background-color: var(--didadi-accent);
}