Brand Assets & Guidelines

Maintain consistency across every touchpoint. Download logos, reference our color & typography system, and follow usage rules to keep the Cup Source brand cohesive and professional.

Logo Usage

Use the primary logo for most applications. The reversed version is for dark backgrounds. Maintain clear space equal to the height of the cup icon.

CLEAR SPACE
Cup Source
Primary
Cup Source
Reversed
Cup Source
Horizontal

✓ Do

  • Use official SVG or high-res PNG files
  • Maintain minimum clear space around the mark
  • Scale proportionally without distortion
  • Use on clean, contrasting backgrounds

✕ Don't

  • Stretch, rotate, or alter proportions
  • Add effects, shadows, or outlines
  • Change colors outside approved palette
  • Place on busy or low-contrast backgrounds

Brand Colors

Our palette reflects warmth, quality, and sustainability. Click any swatch to copy the HEX code.

Espresso
#3B2315 📋
Roast Orange
#E07B39 📋
Golden Crema
#D4A053 📋
Warm Earth
#8B5E3C 📋
Cream Base
#FDF8F4 📋

Typography

We use a clean, highly legible system font stack for maximum performance and cross-platform consistency.

Headings

H1: Premium Quality
font-weight: 800 | size: 2.5rem | line-height: 1.2
H2: Wholesale Solutions
font-weight: 700 | size: 2rem | line-height: 1.3
H3: Eco-Friendly Options
font-weight: 600 | size: 1.5rem | line-height: 1.4

Body & UI

Standard paragraph text for descriptions, guidelines, and documentation.
font-weight: 400 | size: 1rem | line-height: 1.6
Button labels, navigation links, and interactive states.
font-weight: 600 | size: 0.95rem | line-height: 1.4

Captions & Metadata

Uppercase labels, section tags, and auxiliary text.
font-weight: 500 | size: 0.8rem | letter-spacing: 1.5px
File sizes, timestamps, and footer copyright text.
font-weight: 400 | size: 0.85rem | color: muted

Imagery & Iconography

Maintain a cohesive visual language through consistent photography, illustration, and icon styles.

Photography

Use warm, natural lighting. Focus on product texture, clean backgrounds, and real-world usage contexts. Avoid heavy filters or oversaturated tones.

Illustrations

Flat, minimalist vector style. Use brand colors sparingly as accents. Maintain consistent stroke weights (2px–3px) and rounded corners.

Iconography

Line-based, geometric icons. Always use the same corner radius and line thickness. Prefer outline style over filled for UI elements.

📦
🌱
📐

Download Center

Get ready-to-use files for web, print, and social media. All assets are optimized and formatted for production.

📁

Logo Pack (SVG & PNG)

Primary, reversed, and horizontal variants. Includes transparent backgrounds and scalable vectors.

📘

Brand Guidelines (PDF)

Complete usage rules, color codes, typography specs, and application examples.

📱

Social Media Kit

Banner templates, avatar crops, and post frames optimized for LinkedIn, Instagram, and X.

🖨️

Print-Ready Assets

CMYK color profiles, high-res PNGs, and die-line templates for packaging and signage.

Copied to clipboard!