Zaatar & Za'faran

Problem

Restaurant landing pages tend to fall into two camps: generic templates that could be any cuisine, or art projects that bury the menu. I wanted to test whether the 21bits skill could derive a brand-specific design system and compose a cinematic page on its first run — not a swapped template, an actual interpretation of this restaurant.

Role

Wrote the 21bits skill — the discovery flow, the component-shopping rules over ReactBits Pro and 21st.dev, the structural archetypes, and the personality-injection patterns. Then ran it against a one-paragraph brief for a fictional Levantine restaurant. The skill picked the palette (charcoal, saffron, sumac), the typography (display serif italic for the wordmark), and composed the page: hero, philosophy triptych, menu marquee, tabbed space tour, chef bio, reserve CTA.

Outcome

Single-prompt build, production-quality output. Held next to other 21bits builds, the skill's cardinal rule held: each site looks distinct from the others — typography, colour, and rhythm here are unmistakably this restaurant. Next iteration of the skill will tighten the menu marquee and wire a real reservation widget instead of stub links.

Stack