Brand Guidelines
Complete visual identity guidelines for the Muffer brand, including colors, typography, and logo usage.
Color Palette
Main brand color, primary buttons, links
Edit functionality, secondary actions
Success states, positive actions
Content highlights, creative elements
Subscription features, premium content
Admin panels, alerts, career pages
Typography
Available Weights
Font Import
import { Poppins } from 'next/font/google'Typography Examples
Heading 1 - Black
font-black (900)
Heading 2 - Semi Bold
font-semibold (600)
Body Text - Regular
font-normal (400)
Logo Assets
.svg)
.svg)
Usage Guidelines
Use the blue wordmark for primary brand applications
Use the M logo for favicons and small spaces
Use the red wordmark for admin and career pages
Maintain clear space around logos
Primary blue for main brand elements
Use functional colors consistently across features
Ensure sufficient contrast for accessibility
Test colors across different devices and screens