Brand Guidelines
The FrankX design system. Colors, typography, voice, and visual language. Click any color to copy its hex value.
Brand Attributes
Five qualities present in every interaction
Precise
Technical depth. Every pixel, word, and interaction is intentional.
Bold
Confident without being loud. Authority through craft, not claims.
Genuine
Real work, real results. Frank builds in public. Honest exploration.
Creative
AI-augmented. Multi-modal. Music, code, writing, and design.
Warm
Accessible despite depth. Inviting people in, not gatekeeping.
Tagline
Four words. The entire brand.
Build what matters.
Always sentence case. Never ALL CAPS. Never modified. The brevity is the point.
Color System
Dark-first brand with strategic color accents
Dark Foundation
Accent Palette
Typography
Three fonts. Clear hierarchy. Readable at every size.
Body text renders at 17px with 1.8 line-height on a 680px prose column. This produces 65-75 characters per line — the optimal range for sustained reading. White at 85% opacity gives a WCAG AAA contrast ratio of ~7.2:1 against the navy background.
Glassmorphism
Three elevation levels. Always subtle — rgba(255,255,255,0.03) not 0.15.
Subtle
Cards, containers
Medium
Modals, popovers
Elevated
Navigation, CTAs
Voice & Copy
How FrankX sounds. Every word is a design decision.
Do
- "Here's the exact workflow I use" — specific, first person
- "This pattern handles 90% of multi-agent needs" — precise numbers
- "Build what matters." — strong verbs, no hedging
- Studio energy at 2am — explaining to a friend
- Let the work speak — show, don't tell
Don't
- "Unlock your potential" — self-help guru tone
- "Comprehensive solution" — vague, corporate
- "Soul-aligned transformation" — spiritual language
- "We leverage cutting-edge paradigms" — buzzword soup
- Over-explaining philosophy or motivation
Product Hierarchy
Branded house model. All products under FrankX.
Icon Standards
Premium quality only. No childish or emoji-style icons.
Primary: Heroicons
324 icons. Clean, minimal, pixel-perfect at 24px. 1.5px stroke. By Tailwind Labs.
Supplementary: Tabler
4,985 icons including brand logos (GitHub, X, Vercel). MIT licensed.
Never: Phosphor Bold
Too thick, rounded, looks childish. Only for art/music contexts where playful style fits.
Full guidelines: .frankx/brand-guidelines.md
1,367 lines. 14 sections. v1.0 February 2026.