---
name: Contract Mdfitalia
description: "This site is a masterclass in restrained, high-end editorial design, using extreme minimalism to elevate the showcased furniture products."
version: alpha

colors:
  background: "#FFFFFF"
  primary: "#000000"
  secondary: "#141414"
  neutral: "#3E3E3E"
  bg-soft: "#F6F6F6"
  line: "rgba(229, 231, 235, 1)"

typography:
  display:
    fontFamily: geometric-sans
    fontSize: 100px
    lineHeight: 1.0
    fontWeight: 500
    letterSpacing: "-1px"
  heading:
    fontFamily: geometric-sans
    fontSize: 50px
    lineHeight: 1.0
    fontWeight: 500
    letterSpacing: "-0.6px"
  subheading:
    fontFamily: geometric-sans
    fontSize: 24px
    lineHeight: 1.08
    fontWeight: 500
    letterSpacing: "-0.4px"
  body:
    fontFamily: geometric-sans
    fontSize: 16px
    lineHeight: 1.125
    fontWeight: 500
    letterSpacing: "-0.4px"
  small:
    fontFamily: geometric-sans
    fontSize: 15px
    lineHeight: 1.27
    fontWeight: 400
    letterSpacing: "-0.375px"

rounded:
  sm: 2px
  md: 4px
  lg: 8px
  pill: 999px

spacing:
  xs: 4px
  sm: 8px
  md: 16px
  lg: 24px
  xl: 32px
  2xl: 48px
  3xl: 64px

---

## Overview

A premium furniture contract website featuring immersive photography and a restrained, elegant layout.

*A serene, high-end furniture showroom that prioritizes atmospheric photography over cluttered UI.*

## Colors

A high-contrast, neutral palette that lets the product photography dictate the visual warmth.

- **Background (`#FFFFFF`)** — uses `bg` token
- **Primary text (`#000000`)** — uses `ink` token
- **Secondary text (`#141414`)** — uses `ink-soft` token
- **Muted (`#3E3E3E`)** — uses `muted` token
- **Borders (`rgba(229, 231, 235, 1)`)** — uses `line` token

## Typography

- **Display:** geometric-sans
- **Body:** geometric-sans

- Headings use tight tracking (e.g., -0.4px to -1px) for a refined, modern look.
- Body text weight is predominantly 500, creating a denser, more structured feel than standard regular weight.

## Layout

A full-bleed photography layout with a clean, top-aligned navigation and minimal UI elements.

*Rhythm:* A tight, efficient spacing system that prioritizes compact layout over generous whitespace.

## Elevation & Depth

- rgba(0, 0, 0, 0.03) 0px 4px 40px 0px
- rgba(0, 0, 0, 0.3) 0px 30px 70px 0px
- Borders: 1px solid rgb(229, 231, 235)

## Shapes

- `sm`: 2px
- `md`: 4px
- `lg`: 8px
- `pill`: 999px

## Components

- **button:** Minimalist, often borderless or outlined buttons with precise, small padding and tight tracking.
- **card:** Clean, borderless cards that rely heavily on high-quality photography with tight text overlays.
- **input:** Minimal form inputs with thin, subtle borders and no background fill.
- **hero:** A dominant, full-viewport photographic hero that sets an atmospheric, immersive tone.

## Do's and Don'ts

**Don't:**
- Don't use bright primary colors — screenshot shows a strictly monochrome base palette.
- Don't use heavy, ornate borders — screenshot shows borderless or very thin, subtle dividers.
- Don't use overly wide or loose letter-spacing — screenshot shows tight tracking on all headings.
- Don't use large, busy UI patterns — screenshot shows a restrained, photography-focused layout.
- Don't use heavy drop shadows on cards — screenshot shows very subtle, soft elevation shadows.
- Don't use playful, rounded UI elements — screenshot shows sharp, clean, rectangular or minimally rounded components.

---

## System Prompt (paste into AI agent)

```
This design is for a premium furniture contract website, prioritizing atmospheric, full-bleed photography over complex UI. The palette is strictly monochrome, using #FFFFFF and #F6F6F6 for backgrounds, #000000 for primary text, and #3E3E3E for muted elements. Typography uses a clean, geometric sans-serif with tight negative letter-spacing for a sophisticated, modern feel. Critical donts include avoiding bright accent colors, avoiding heavy UI borders or drop shadows, and avoiding loose or playful typography. The layout is expansive and clean, letting the product imagery dominate the visual hierarchy.
```