## Logo The Vary logo is five offset horizontal bars. The wordmark version adds "vary" in Overused Grotesk Medium. Download the SVG files below. ### Logo with text | Variant | Preview | | |---------|---------|---| | Blue (primary) |

| | | Black |

| | | White |

| | ### Logo mark only | Variant | Preview | | |---------|---------|---| | Blue (primary) |

| | | Black |

| | | White |

| | ## Colors ### Light Mode | **Role** | **Hex** | **Usage** | |----------|---------|-----------| | Background | `#F0ECE4` | Main page background | | Text | `#2E3238` | Body text and headings | | Accent | `#2F56A6` | Links, buttons, primary accent | | Muted Text | `#6b7280` | Secondary text, eyebrow labels, nav links | | Panel | `#2F56A6` | Code blocks, dark panels, feature surfaces | ### Dark Mode | **Role** | **Hex** | **Usage** | |----------|---------|-----------| | Background | `#1a1b20` | Main page background | | Text | `#e2dfd8` | Body text and headings | | Accent | `#9ca3af` | Accent text and links | | Muted Text | `#8b919a` | Secondary text, eyebrow labels, nav links | | Panel | `#1e2640` | Code blocks, dark panels, feature surfaces | ### Decorative Squares

Role	Light Panel	Dark Panel	Usage
Decoration Square Strong	`#EAEEF6`	`#E9E9EC`	Bright filled squares on panel-based decorative grids
Decoration Square Medium	`#7891C5`	`#6D7383`	Mid-strength decorative squares
Decoration Square Subtle	`#4064AD`	`#30374F`	Base and low-contrast decorative squares
Zigzag Square Strong	`#C1CCE4`	`#BCBEC6`	Bright squares in homepage zigzag decorations
Zigzag Square Medium	`#6D89C1`	`#626779`	Mid-strength zigzag squares

## Fonts The primary typeface is [Overused Grotesk](https://randommaerks.github.io/overused-grotesk), a free and open-source variable font. Code blocks use JetBrains Mono. | **Name** | **Weight** | **Usage** | |----------|-----------|-----------| | Overused Grotesk Variable | Book (425) | Body text, nav | | Overused Grotesk Variable | Medium (460) | Headings, eyebrow labels, feature titles | | Overused Grotesk Variable | SemiBold (600) | Buttons, CTAs, table headers | | JetBrains Mono | Regular | Code blocks, inline code | ## Varyfont Vary has its own custom created font: `varyfont`. It is a 5x7 bitmap display font used for OG artwork and exported here as downloadable assets. | **Format** | **Download** | |------------|--------------| | WOFF2 | Varyfont-Regular.woff2 | | TTF | Varyfont-Regular.ttf |

varyfont

### Character Set

;

(

)

[

]

{

}