Obsidian.md Numbered Headers (for default theme)

numbered-headers.css

body {
  .markdown-source-view.is-live-preview,
  .markdown-rendered,
  .print {
    /* Approximate width of the h1-h6 marker and the fold marker */
    --marker-width: -34px;

    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
      position: relative;
    }

    .HyperMD-header::before,
    .inline-title[data-level],
    h1::before,
    h2::before,
    h3::before,
    h4::before,
    h5::before,
    h6::before {
      font-size: 0.5em;
      font-weight: 200;
      position: absolute;
      font-family: var(--font-default);
      visibility: visible;
      vertical-align: middle;
      left: var(--marker-width);
    }

    .HyperMD-header-1::before,
    .inline-title[data-level="1"],
    h1::before {
      content: "h1";
      line-height: calc(var(--h1-line-height) * 2);
    }
    .HyperMD-header-2::before,
    .inline-title[data-level="2"],
    h2::before {
      content: "h2";
      line-height: calc(var(--h2-line-height) * 2);
    }
    .HyperMD-header-3::before,
    .inline-title[data-level="3"],
    h3::before {
      content: "h3";
      line-height: calc(var(--h3-line-height) * 2);
    }
    .HyperMD-header-4::before,
    .inline-title[data-level="4"],
    h4::before {
      content: "h4";
      line-height: calc(var(--h4-line-height) * 2);
    }
    .HyperMD-header-5::before,
    .inline-title[data-level="5"],
    h5::before {
      content: "h5";
      line-height: calc(var(--h5-line-height) * 2);
    }
    .HyperMD-header-6::before,
    .inline-title[data-level="6"],
    h6::before {
      content: "h6";
      line-height: calc(var(--h6-line-height) * 2);
    }
  }
}