darcula.css

:root {
  --base00: #2b2b2b; /* dark background */
  --base01: #323232; /* lighter background */
  --base02: #323232; /* Selection background */
  --base03: #606366; /* Comments, Invisibles, line highlighting */

  --base04: #a4a3a3; /* Dark foreground */
  --base05: #a9b7c6; /* Default foreground */
  --base06: #ffc66d; /* Light foreground */
  --base07: #ffffff; /* Light background */

  --base08: #4eade5; /* Red */
  --base09: #689757; /* orange */
  --base0A: #bbb529; /* yellow */
  --base0B: #6a8759; /* Green */
  --base0C: #629755; /* Cyan */
  --base0D: #9876aa; /* Blue */
  --base0E: #cc7832; /* purple */
  --base0F: #808080; /* brown */

  --font-stack: "Inconsolata"
}


/*************************
 * Font selection
*************************/

.workspace {
  font-family: var(--font-family-editor);
}

.markdown-preview-view {
  font-family: var(--font-family-preview) !important;
}

/*************************
 * workspace
*************************/

.workspace {
  color: var(--base06) !important;
  background-color: var(--base00) !important;
}

.workspace-tabs {
  color: var(--base06) !important;
  background-color: var(--base00) !important;
}

.workspace-tab-header {
  color: var(--base06) !important;
  background-color: var(--base00) !important;
}

.workspace-tab-header-inner {
  color: var(--base02) !important;
}

.workspace-leaf {
  color: var(--base06) !important;
  background-color: var(--base00) !important;
}

/*************************
 * View header
*************************/

.view-header {
  background-color: var(--base00) !important;
  color: var(--base06) !important;
  border-bottom: 1px solid var(--base01);
}

.view-header-title {
  color: var(--base06) !important;
}

.view-header-title-container:after {
  background: none !important;
}

.view-content {
  background-color: var(--base00) !important;
  color: var(--base06) !important;
}

.view-action {
  color: var(--base06) !important;
}

/*************************
 * Nav folder
*************************/

.nav-folder-title, .nav-file-title {
  background-color: var(--base00) !important;
  color: var(--base06) !important;
}

.nav-action-button {
  color: var(--base06) !important;
}

/*************************
 * Markdown headers
*************************/

.cm-header-1, .markdown-preview-view h1 {
  color: var(--base0A);
}

.cm-header-2, .markdown-preview-view h2 {
  color: var(--base0B);
}

.cm-header-3, .markdown-preview-view h3 {
  color: var(--base0C);
}

.cm-header-4, .markdown-preview-view h4 {
  color: var(--base0D);
}

.cm-header-5, .markdown-preview-view h5 {
  color: var(--base0E);
}

.cm-header-6, .markdown-preview-view h6 {
  color: var(--base0E);
}

/*************************
 * Markdown strong and emphasis
*************************/

.cm-em, .markdown-preview-view em {
  color: var(--base0D);
}

.cm-strong, .markdown-preview-view strong {
  color: var(--base09);
}

/*************************
 * Markdown links
*************************/

.cm-link, .markdown-preview-view a {
  color: var(--base0C) !important;
}

.cm-formatting-link,.cm-url {
  color: var(--base03) !important;
}

/*************************
 * Quotes
*************************/

.cm-quote, .markdown-preview-view blockquote {
  color: var(--base0D) !important;
}

/*************************
 * Code blocks
*************************/

.HyperMD-codeblock, .markdown-preview-view pre {
  color: var(--base07) !important;
  background-color: var(--base01) !important;
}

.cm-inline-code, .markdown-preview-view code {
  color: var(--base07) !important;
  background-color: var(--base01) !important;
}

/*************************
 * Cursor
*************************/

.CodeMirror-cursors {
  color: var(--base0B);
  z-index: 5 !important /* fixes a bug where cursor is hidden in code blocks */
}