Design System

Hanzo Brand
Guidelines.

A comprehensive guide for creating consistent, elegant, and minimal interfaces across our platform and products.

Design Principles

Our core principles guide every design decision we make.

Minimal & Focused

Reduce visual noise and focus on essential elements. Each design decision should have purpose and enhance the user experience.

Elegant & Refined

Use subtle gradients, appropriate spacing, and thoughtful typography to create elegant and sophisticated interfaces.

Consistent & Cohesive

Maintain consistency in design patterns, spacing, and visual hierarchy to create a unified experience across all touchpoints.

Color Palette

Our colors are carefully selected to create a bold, modern aesthetic.

Brand Colors

Hanzo Red
#FD4444
Pure Black
#000000
Pure White
#FFFFFF
Deep Gray
#171717

Gray Scale

Gray 900
#171717
Gray 800
#262626
Gray 700
#404040
Gray 600
#525252
Gray 500
#737373
Gray 400
#A3A3A3

Gradients

Brand Glow
Radial
White Fade
Linear
Gray Fade
Linear

Typography

Clean, readable typography is essential to our design language.

Heading 1
Large page titles, hero sections
Heading 2
Section titles, major divisions
Heading 3
Subsection headings, feature headings
Heading 4
Card titles, minor section headings
Body Large
Featured paragraphs, pull quotes
Body
Primary body text
Caption
Supporting text, metadata, labels

Components

Reusable UI components that maintain consistency across our products.

Buttons

Cards

Card Title

This is a standard card component with hover states and consistent styling.

Badges

Brand Badge
Default Badge
Success Badge

Need brand assistance?

Our team can help with custom assets, co-branding requests, and other brand-related inquiries.