Caraway — Cream & Sage Kitchen DTC

Cozy kitchen commerce: cream canvas, sage and terracotta accents, serif warmth over clean sans utility, swatch-dotted product cards and a soft-green trust panel.

Source capture · 2026-09-05Open full image ↗

Commerce

Design notes

Mood

Domestic optimism — a health-first home brand that feels like a well-organized pantry. Playful (sweepstakes stickers, swatch dots) but grounded in trust language and third-party testing.

Colors

Warm cream base (#FAF5E9 feel) with a muted sage green panel color (#7D8C6E), soft mint-green trust sections, a mustard-yellow full-width banner, terracotta/coral sticker accents, and navy ink. Product colorways (navy, sage, coral, cream) echo the palette. Red only as tiny SAVE badges.

Type

A refined display serif for hero and section headlines ('$100,000 Dream Kitchen Sweepstakes', 'Kitchenware With High Standards') paired with a small clean sans for UI, prices, and labels. Letterspaced caps for eyebrow labels; underlined text links with arrows.

Layout

Merchandised modules stacked tight: split hero (color panel + photography with a rotated sticker badge), 4-up product cards with star ratings, strikethrough prices, and color swatch dots; numbered 1-2-3 how-it-works circles; full-width yellow promo band; category circle row; UGC video carousel; split trust panel (photo + soft green text block with checkmarks); scrolling ticker footer of promises.

Motion

Light retail motion: carousels glide with chevron controls, swatch dots swap product imagery instantly, UGC videos play on hover, the ticker footer scrolls continuously. Cheerful but restrained — no parallax drama.

Texture

Matte and tactile: ceramic sheen in photography, flat color panels, soft rounded corners on cards and buttons, hand-placed rotated stickers for promos. No glossy gradients or shadows beyond a whisper.

Imagery

Warm domestic photography: styled kitchen scenes with marble counters, wood shelves, and ceramic cookware in muted navy/sage/coral colorways under soft daylight — Pexels for authentic kitchen lifestyle; kie-ai Seedream for color-matched product-set stills on cream seamless. Plus vertical UGC-style video frames of real people cooking, with @handle captions. Everything golden-hour warm, never studio-cold.

Don't

No cold greys or tech-brand black, no hard sells beyond playful badges, no sharp corners, no cluttered dark sections. Never let promo modules break the cream-and-sage calm — even the sweepstakes stays soft.

Make it your own

Turn this reference into a useful brief for your project. Copy it into the AI tool you already use.

Your project

Use withAny AI toolCodexClaudeCursorChatGPTGeminiv0 / LovableI want toBuild a screenAudit my UIWrite a design brief

Tech stackUse the existing project stackReact / Next.jsAstroVue / NuxtSvelte / SvelteKitHTML / CSS / JavaScriptSwiftUIFlutter

Add constraints

What should the tool respect?

Preview & edit prompt

Prompt text# My project [Describe the product, audience, and screen you want to improve] Stack: Use the existing project stack Task: Implement the interface and verify the result in the existing project. ## Tool guidance (Any AI tool) Use available project tools to inspect, implement, and test. State any unavailable capabilities. # Design reference: Caraway — Cream & Sage Kitchen DTC Source: https://www.carawayhome.com Swipefile reference: https://swipefile.design/ref/caraway-warm-dtc/ Captured: 2026-09-05. This is a dated reference, not a claim about the current live product. Capture scope: a page excerpt. Do not infer unseen sections or interactions. ## Objective Adapt the visual principles below to my project. Use my own content and identity. Do not reproduce logos, proprietary copy, or brand assets. ## Reference notes - mood: Domestic optimism — a health-first home brand that feels like a well-organized pantry. Playful (sweepstakes stickers, swatch dots) but grounded in trust language and third-party testing. - colors: Warm cream base (#FAF5E9 feel) with a muted sage green panel color (#7D8C6E), soft mint-green trust sections, a mustard-yellow full-width banner, terracotta/coral sticker accents, and navy ink. Product colorways (navy, sage, coral, cream) echo the palette. Red only as tiny SAVE badges. - typography: A refined display serif for hero and section headlines ('$100,000 Dream Kitchen Sweepstakes', 'Kitchenware With High Standards') paired with a small clean sans for UI, prices, and labels. Letterspaced caps for eyebrow labels; underlined text links with arrows. - layout: Merchandised modules stacked tight: split hero (color panel + photography with a rotated sticker badge), 4-up product cards with star ratings, strikethrough prices, and color swatch dots; numbered 1-2-3 how-it-works circles; full-width yellow promo band; category circle row; UGC video carousel; split trust panel (photo + soft green text block with checkmarks); scrolling ticker footer of promises. - motion: Light retail motion: carousels glide with chevron controls, swatch dots swap product imagery instantly, UGC videos play on hover, the ticker footer scrolls continuously. Cheerful but restrained — no parallax drama. - texture: Matte and tactile: ceramic sheen in photography, flat color panels, soft rounded corners on cards and buttons, hand-placed rotated stickers for promos. No glossy gradients or shadows beyond a whisper. - dont: No cold greys or tech-brand black, no hard sells beyond playful badges, no sharp corners, no cluttered dark sections. Never let promo modules break the cream-and-sage calm — even the sweepstakes stays soft. ## Acceptance criteria - Existing project conventions, design tokens, working functionality, and unrelated changes are preserved. - Two or three reference principles clearly support the user's task; conflicts are resolved in favor of usability and the existing product. - Reusable components and semantic HTML express the interface. Available licensed assets are used; important UI text is never rendered as a bitmap. - Every visible control has a defined behavior. Loading, empty, error, success, disabled, and long-content states are specified where relevant. Demo data is clearly labeled. - Navigation and content adapt at 375px, 768px, and 1440px without horizontal page overflow. Keyboard use, visible focus, labeled inputs, at least 44px touch targets, readable contrast, and reduced motion are supported. - Verification distinguishes rendered behavior from proposals and identifies anything still requiring a backend or external service. ## Quality bar Clear hierarchy, consistent spacing, restrained surfaces, and purposeful motion. Avoid decorative gradients, excessive cards, placeholder buttons, and invented metrics unless the project calls for them. Do not claim a feature is connected or tested without evidence.

Copy promptDownload .md

Assembled in your browser. No API key or AI request needed. Changing the fields refreshes the preview.