DESIGN.md · explainx registry
Licious
Licious's design system is "Hearty and Fresh." It uses a rich "Hearty Red" and smoky neutrals to create an appetite-driven, premium experience for meat and seafood delivery.
Design System#design#ui#ux#template
DESIGN.md (markdown body)
| name | Licious |
| colors | background: "#fbf6f4" # Creamy White foreground: "#4f5b66" # Smoky Grey brand: "#cc0000" # Hearty Red muted: "#7c7c7c" border: "#eeeeee" card: "#ffffff" accent: "#f69092" # Fruity Licious dark: background: "#1a0a0a" foreground: "#fbf6f4" muted: "#a1a1a1" border: "#4f5b66" card: "#212121" accent: "#cc0000" |
| typography | fontFamily: sans: "Basis Grotesque, Inter, system-ui, sans-serif" body: fontSize: "15px" lineHeight: "1.4" heading: fontWeight: "700" letterSpacing: "-0.01em" |
| rounded | default: "4px" md: "12px" lg: "20px" |
Design System: Licious
Overview
Licious's design system is "Hearty and Fresh." It uses a rich "Hearty Red" and smoky neutrals to create an appetite-driven, premium experience for meat and seafood delivery.
Design Philosophy
- Freshness First: Uses a warm "Creamy White" background to evoke a sense of cleanliness and artisanal quality.
- Appetite & Quality: The "Hearty Red" (
#CC0000) represents the brand's focus on high-quality meat and the passion of the craft. - Artisanal Modernism: Combines clean, modern typography with soft, organic shapes to feel both technical and handcrafted.
- Transparency: Prioritizes freshness markers, temperature-controlled delivery info, and detailed sourcing data.
Colors
- Hearty Red (#CC0000): The primary identifier, used for primary CTAs and brand presence.
- Smoky Grey (#4F5B66): Used for text and headers to provide a sophisticated, grounded contrast.
- Creamy White (#FBF6F4): A soft, warm background that feels more premium and organic than pure white.
Typography
- Basis Grotesque: A clean, modern sans-serif that provides a professional yet approachable voice.
- Bold Hierarchy: Uses heavy weights for product weights and prices to ensure they are the first things users see.
Components
- The "Freshness" Badge: A signature icon used to guarantee the quality and source of the meat.
- Product Cards: Feature large, high-resolution photography with integrated "Ready-to-Cook" or "Fresh" tags.
- Category Sliders: Uses rounded icons and vibrant photography to guide users through meat, seafood, and poultry.
Visual Effects
- Subtle Texture: Occasionally uses subtle paper or wood-like textures in marketing headers to reinforce the artisanal feel.
- Warm Overlays: Uses the brand red as a translucent overlay for special "Deal of the Day" sections.
- Micro-animations: Snappy, delightful animations for adding items to the cart and delivery updates.
Usage
- Copy DESIGN.md into your project or paste it into your IDE agent chat.
- Ask your assistant to follow the tokens for color, typography, spacing, and component styling.
- When collaborating, share the file directly—or tap “Copy page link” below so teammates open the same snapshot.
Common questions
- What is Licious on explainx.ai?
- Licious's design system is "Hearty and Fresh." It uses a rich "Hearty Red" and smoky neutrals to create an appetite-driven, premium experience for meat and seafood delivery. Listed under category “Design System”. Explainx.ai mirrors the full DESIGN.md document so assistants can cite stable tokens and prose in one place.
- What is DESIGN.md?
- DESIGN.md blends YAML design tokens—colors, typography, spacing, radii—with markdown that explains intent. Google documents this pattern for agent-driven UI work under Stitch (stitch.withgoogle.com).
- How do I use this with ChatGPT, Cursor, Claude Code, or another IDE agent?
- Paste the DESIGN.md into your repo root or attach it to the agent conversation, then ask explicitly for layouts, spacing, palette, type scale, and component tone that follow the document. Refresh from this listing when upstream authors publish changes.
- Where is the source repo?
- Maintainers link to github.com/whyashthakker/design-md-templates-skills. Community listings on explainx.ai may reference popular aesthetic names for inspiration; that does not imply official endorsement by any trademark holder.
- How current is this DESIGN.md?
- Explainx snapshots the file at import time. Recorded last update on this listing: May 8, 2026.
- Need a fresh DESIGN.md from scratch?
- Use the ExplainX DESIGN.md generator to describe your product and audience; it returns Stitch-style YAML plus narrative guidance you can publish or submit to the registry afterward.
Still exploring the format? Browse the full DESIGN.md registry or draft a new system with our DESIGN.md generator.
Community listing for AI design workflows—not necessarily affiliated with any brand referenced in the name or summary. For context on the format, see Google Stitch.
List Your Design.md
Share your design system with AI agents worldwide