Clavitor

Design System v0.1 — Violet + Figtree + JetBrains Mono

CLAVITOR

A black box vault for AI infrastructure. Tokens, components, layouts. Based on vault1984.com patterns.

Logo Lockup (Black Square + Wordmark + Tagline)
CLAVITOR
Black-box credential issuance

Spec: Square: 80×80px #0A0A0A (Black Square) · Wordmark: Figtree 700, 56px, 0.25em, #7C3AED (Violet) · Tagline: 16px, 0.22em, uppercase, #737373 (Text Tertiary)

↓ Download clavitor-logo.svg ↓ Download clavitor-logo.png (800×800)

Logo Lockup — Scale Variants

200%

CLAVITOR
Black-box credential issuance

150%

CLAVITOR
Black-box credential issuance

100%

CLAVITOR
Black-box credential issuance

50%

CLAVITOR
Black-box credential issuance
Brand Colors
Black Square
--brand-black
#0A0A0A
Violet
--brand-accent
#7C3AED
Violet Light
--brand-accent-light
#8B5CF6
Violet Dark
--brand-accent-dark
#6D28D9
Typography — Figtree
wordmarkCLAVITOR
72pxHeading 72
56pxHeading 56
40pxHeading 40
28pxHeading 28
16pxBody 16 — The quick brown fox jumps over the lazy dog
14pxSmall 14 — Supporting text, labels, metadata
Buttons
Inputs
Please enter a valid email address.
Layout Patterns (from vault1984.com)

2-Column Equal (Hero/Feature)

Heading Left

Description text goes here. This is the left column of a two-column layout pattern used for hero sections and feature comparisons.

MCP REST API CLI

$ clavitor status
Vault: secure

3-Column Features

Feature One

Description of the first feature with details.

Feature Two

Description of the second feature with details.

Feature Three

Description of the third feature with details.

4-Column Stats

1
Binary
1
SQLite
5
MCP Tools
0
Dependencies
Code — JetBrains Mono
$ clavitor deploy production
Deploying to production... 0x7f3a9b2c
Credentials: github-token, aws-key

Inline code: --brand-accent or get_credential()

Utility Classes

Typography

.text-lg — 18px subtitle size

This entire card is centered with .text-center

Spacing (margin-top)

mt-0 baseline
mt-4 adds 16px margin-top
mt-8 adds 32px margin-top

Flex utilities

.justify-center centers items
.justify-between pushes to edges

Component variants

.black-square-sm (48×48px)
.black-square (64×64px)

Border utilities

.border-top — top border separator