sweetgreen

sweetgreen

Preview image. Unlock full-res

Farmer's market clarity

Industryecommerce
Palette
#e6ff55
#00473c
#0e150e
#f4f3e7
#d8e5d6
#e8dcc6
#8c8c82
#9fa19f
#000000

Sweetgreen cultivates a fresh, approachable aesthetic with a primary focus on ingredient transparency and natural vitality. Its visual language balances an organic, handcrafted feel with clean, modern utility. A vibrant, almost neon green-yellow acts as a spirited accent against an otherwise muted, earthy palette of desaturated greens and soft off-whites, echoing fresh produce against natural backdrops. Typography is friendly yet confident, pairing a distinct, light-weight display face for headlines with a clean sans-serif for body text. Components are light, favoring generous organic radii and subtle elevation. Always use Fresh Sprout (#e6ff55) exclusively for primary action backgrounds and brand highlights to maintain its energetic impact. Apply the 1000px border-radius token for all primary and navigation filled buttons to achieve a distinct pill shape. Prioritize text legibility by pairing Soil Shadow (#0e150e) or Garden Patch (#00473c) on Field Cream (#f4f3e7) or Willow Mist (#d8e5d6) backgrounds. Utilize 'Grenette' font at weight 200 for large display headlines to convey authority through subtlety and restraint. Maintain a clear visual hierarchy with generous vertical spacing, using the sectionGap of '40px' between major content blocks. Introduce card elevation sparingly using the rgba(14, 21, 14, 0.4) 3px 3px 32px -10px shadow for interactive elements or featured content. Employ the 24px border-radius for cards and content containers to soften their edges and contribute an organic feel. Do not use Fresh Sprout (#e6ff55) for general text or borders, as it dulls its impact as an accent. Avoid solid, sharp-edged rectangles for interactive elements; opt for rounded corners, especially 20px for badges and 1000px for buttons. Do not use 'SweetSansText' for large, impactful headlines; reserve the distinctive 'Grenette' for hero text and primary titles. Refrain from heavy, dark background sections unless explicitly for a footer or dedicated dark mode component. Avoid using multiple chromatic colors together; let Fresh Sprout be the primary splash of color. Do not introduce complex drop shadows or hard outlines; elements should feel light and naturally elevated or integrated. Never use excessive or inconsistent letter-spacing; adhere to the specified tracking for each font style and size.

More like this