Brand Visual Style Guide

Brand Visual Style Guide — KlōTHING

Bold & Energetic branding, mobile-first design, and photo-ready imagery to boost conversions.

Accent color (Primary)

Accent Option A
Primary Accent: Neon Teal
Accent Option B
Secondary concept (not active)
Accent Option C
Secondary concept (not active)

Decision: Primary Accent is Neon Teal. Use across UI elements (buttons, links, highlights) for bold contrast on mobile and desktop.

Typography

Headings

Font: Inter or Montserrat, bold

Usage: H1 36–40px, H2 28–32px, H3 22–26px

Body

Font: Inter or Roboto

Usage: 16–18px, line-height ~1.5

Buttons

Case: sentence case recommended

Notes: bold is fine; uppercase not required for readability

UI Tokens

Buttons
  • Primary: filled, rounded 8–12px
  • Secondary: outline
  • Hover: elevated shadow
Cards
  • Shadow on hover, subtle lift
  • Rounded corners 12px
Spacing
  • Baseline grid: 8px
  • Generous whitespace for bold visuals

Imagery treatment

Shot types
  • Product shot on white
  • Lifestyle shot
  • Detail shot
Specs
  • 1:1 product shots; 4:3 or 16:9 for lifestyle
  • 2048x2048 px (product), 1500–1800 px long edge (hero)
  • WebP preferred; JPG/PNG fallback
Alt text

[Product name] in [color] – fabric/fit highlights

Layout Principles (Home, Product, Collection)

Home: Bold hero, category blocks, social proof

Product pages: Gallery with zoom, color swatches, size chart, sticky add-to-cart

Collection: Grid with filters, consistent aspect ratios

Accessibility & SEO basics

Alt text, aria-labels, semantic HTML, color contrast > 4.5:1 where possible

Image Brief for Product Photography

Objectives: Elevate product visuals for mobile-first experiences

Shots per product: 3–4 images minimum (Product, Lifestyle, Detail, Optional on-model)

Specs: 2048x2048 px, 1:1 product, 4:3 or 16:9 for lifestyle, WebP, naming conventions, alt templates

Next steps

Option: I can implement a live Site Visual Audit and deliver the detailed results, plus provide a designer-friendly style brief and image brief you can hand off to your team or a freelancer.