How To Use This Tool
- Select a Style: Choose a style that matches your brand personality
- Choose Background: Pick light or dark background preference
- Generate: Create your brand kit with one click
- Customize: Regenerate specific elements as needed
Your brand kit includes color palette, accessibility check, typography, icons, and preview examples.
Professional Color Palette
Accessibility Preview
Primary Color (60%): Use for main headers, buttons, and key elements.
Secondary Color (30%): Use for subheaders, secondary buttons, and less prominent elements.
ACCENT COLOR (10%): Use for call-to-action buttons, links, and highlights.
Body Text Example- 60-30-10 Rule: This rule helps in creating a balanced color scheme. Use 60% of the primary color, 30% of the secondary color, and 10% of the accent color in your design. Body Text Color, Background Color.
Professional Font Pairing
Header Text Example
This is body text example. The secondary font should be readable at small sizes and pair well with our main font. Suggested fonts are free Google fonts.
Personality Font
Playfair Display
serif
Recommended weight: 700
Secondary / Body Font
Open Sans
sans-serif
Recommended weight: 400
Icon Style
Style:
Recommended Source:
Other Free Sources:
Icon Preview:
Layout Preview
Get Fresh Content Delivered to Your Inbox!
Send Some Love
(and Coffee)
Your donation helps support more posts and keeps this site alive.
We pride ourselves on offering unbiased, independent information— we do not engage in affiliate marketing or referral links. Every contribution goes directly toward supporting the creation of more valuable posts and maintaining the integrity of this space. Thank you for your kindness!