Markdown Preview Styles
H1 — Arctic Fox
H2 — Section Heading
H3 — Subsection
H4 — Minor Section
H5 — Label
H6 — Note
This block simulates markdown-preview-view. Links look like this link and on hover they brighten.
Caption text uses the caption color.
Inline code sample and a preformatted block below:
// sample.js
function greet(name) {
return `Hello, ${name}!`;
}
console.log(greet("Trev"));Markdown Source Styles
H1 — Editor Title
H2 — Editor Section
H3 — Editor Subsection
H4 — Minor Section
H5 — Label
H6 — Note
Muted text via muted can indicate hints or placeholders.
Highlight demo: badge / highlight
Warning, Danger, and Success colors for status text.
Scrollbars & Tertiary Surfaces
The box below forces a scrollbar to show off the themed track & thumb.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sit amet felis at nibh vehicula vehicula. Integer non sapien non massa commodo placerat. Phasellus nec risus condimentum, elementum nibh non, maximus ipsum.
Vivamus sit amet erat at justo pretium bibendum. Sed vitae feugiat tellus. Maecenas id finibus nisl, non porta nunc. Suspendisse vitae dolor ut felis convallis euismod in ut enim.
Aliquam erat volutpat. Duis in mollis odio. Nulla facilisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Integer molestie, velit vitae iaculis tempor, leo justo bibendum arcu, sed viverra sem nisl non lacus.
Curabitur auctor, ipsum non vulputate auctor, ante arcu cursus enim, quis venenatis nibh augue nec urna. Integer fringilla interdum tincidunt.
Buttons, Menu Items, & "Folder" Titles
Hover these to see accent hover + border change.
Misc Text & Elements
Normal text on --background-secondary. Try a hovered link.
Caption text example
Muted helper text (placeholders / hints)
Keyboard key: Ctrl + K
Inline highlight style via badge (uses highlight colors).