Brand identity systems
Logo suites, type stacks, and usage guardrails for fast-moving teams.
Pattern Library
Gibsooon Design System
Foundational styles, reusable components, and interaction patterns that power the theme.
Use this reference to keep new features aligned with the system. All examples reuse the same template parts and tokens shipped across the website, so updates made here cascade everywhere.
Color system
Tokens that drive the brand themes
Each accent swaps dynamically via CSS custom properties. Reference the tokens below when extending palettes.
Brand palette
Brand 900
--brand-900
Background accents & dark gradients
Brand 700
--brand-700
Primary gradient start
Brand 500
--brand-500
Primary buttons & highlights
Brand 300
--brand-300
Soft backgrounds & badges
Neutrals
Neutral 000
--neutral-000
Surface base
Neutral 100
--neutral-100
Cards & muted backgrounds
Neutral 500
--neutral-500
Muted typography
Neutral 700
--neutral-700
Body text on light surfaces
Semantic & surfaces
Highlight
--color-highlight
Interactive states & key links
Highlight Soft
--color-highlight-soft
Accent backgrounds
Warning
--color-warning
Inline notices
Surface Inverse
--color-surface-inverse
Footer background
Typography
Inter & Space Grotesk keep things clear and bold
Scale values map to CSS variables so headings stay consistent across templates.
Display / H1
I help founders build brands that matter
Headline / H2
Lightning-fast creative sprints
Section title / H3
Why work with Gibson
Body copy / Paragraph
From discovery to delivery, we keep feedback loops tight and documentation clear so your team can scale without adding overhead.
Caption / Small
Response time: under 24 hours. Availability: accepting new projects this month.
Interactions
Buttons & actionable elements
Primary buttons use the accent gradient, while ghost buttons adopt contextual borders. Legacy .btn styles remain for link-style CTAs.
Forms
Grid-based inputs keep long forms scannable
The same structure powers the contact form and onboarding flows. Swap field orders without breaking alignment.
Components
Reusable building blocks
Each block is a template part. Pull them into new templates instead of rebuilding from scratch.
CTA Panel
Ready to ship
Launch a complete brand kit in eight days
Strategy, identity, and launch assets packaged together. Every engagement includes documentation and rollout guidance.
- Stakeholder-ready decks
- Async updates & Loom recaps
- Implementation support
Cards grid
Experience design
Product flows, onboarding, and customer journeys mapped end-to-end.
Pitch & investor decks
Story-led decks crafted to close deals and raise the next round.