\:root

--font-primary: Lato, Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'

--font-display: 'IBM Plex Sans', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'

--font-code: 'IBM Plex Mono', Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace

// Font Sizes

--font-size-xs: 1.15rem

--font-size-sm: 1.3rem

--font-size-md: 1.5rem

--font-size-lg: 1.8rem

--font-size-xl: 2.4rem

// Line heights

--line-height: 1.6

// Colors

--color-back: #fff

--color-front: #444

--color-theme: #5C6373

--color-theme-contrast: #fff

--color-subtle-dark: #777

--color-subtle-medium: #eee

--color-subtle-light: #f9f9f9

--color-background-code: #7a818117

--color-button-primary: #29c15b

--color-button-primary-contrast: #fff

--color-button-secondary: #cdcdd4

--color-button-secondary-contrast: #686873

--color-button-danger: #d21313

--color-button-danger-contrast: #fff

--color-correct-light: #e3fde8

--color-correct-dark: #007737

--color-incorrect-light: #fde7e7

--color-incorrect-dark: #d21313

// Syntax Highlighting

// based on https://github.com/sdras/night-owl-vscode-theme

--syntax-background: #f7f7f7

--syntax-text: #324540

--syntax-selected-background: #7a81812b

--syntax-comment: #989fb1

--syntax-tag: #994cc3

--syntax-number: #aa0982

--syntax-selector: #994cc3

--syntax-operator: #994cc3

--syntax-function: #4876d6

--syntax-keyword: #994cc3

--syntax-regex: #5ca7e4

--ansi-green: #12dc55

--ansi-red: #f76464

--ansi-cyan: #00d8ff

// Sizes

--width-container: 800px

--size-profile-pic: 125px

--border-radius: 5px