How well does it score?

86% average fidelity over 4 recorded runs. Best model: Claude 4.6 Sonnet. Weakest recorded run: 85% on Codex.

Are failures included?

No build failures are recorded for this prompt, and the log says so rather than implying every model succeeded elsewhere.

Concept render — composed live from this prompt's palette & layout. Reproducible with the library, not a stock screenshot.

Concept scene: Morph Blob — open in library →

HealthcareBetaby Motif Studiopublished 2026-09-12

Veterinary clinic with species tabs and emergency banner

Q: What does the Veterinary clinic with species tabs and emergency banner prompt produce?

A healthcare website with Emergency banner, Species tabs, Services grid, Staff roster, Booking CTA. The vibe target is "friendly-practical, clean, reassuring" and the prompt body is printed in full on the page.

vibe: friendly-practical, clean, reassuring

intermediate — 5 blocks, 2 stacksany viewport≈ 95 lines generated (estimate)≈ 800 tokens to run (estimate)

prompt.txt — copy-paste ready

A clinic page for the whole menagerie.
• Palette: soft mint, ink, one coral accent reserved for the emergency banner — which is always first in DOM and never animated.
• Emergency banner: phone number, hours of the emergency line, one sentence of triage guidance.
• Species tabs: Dog / Cat / Exotic — each switches services and pricing notes; the tab list is real tabs (role, arrow keys, announced).
• Services grid: six services with a one-line scope and species applicability.
• Staff roster: four clinicians with species specialty and credential line.
• Booking CTA: calm, phone-first, form optional.
• The emergency banner is never dismissed, never moved by layout, and reads before everything else.• Craft floor: Reduced motion is honoured with a static branch; all colours flow through CSS-variable tokens.

Palette tokens:#F4FAF7#12332B#2E8C7F#E06A5A#1F4A40

revised 2026-09-12 — Bank-3 batch 3: palette tokens, component links, viewport and the retry guard added under items #52/#55/#57/#74.

Remix this brief:

— Lighter: same brief on a white ground with one accent kept.
— Denser: halve the whitespace and add a second content column.
— Playful: keep the structure, swap the display face and let one section animate on view.

Stacks shipped:Next.jsHTMLBlocks:Emergency bannerSpecies tabsServices gridStaff rosterBooking CTA

Components this brief typically renders:

Tabs with Sliding Indicator →Inline Status Banner →Team Grid with Roles Filter →

Community:▶ Re-run this prompt ⤴ Submit a remix of it ★ Your saved listRe-runs are a labelled simulation; the run log on this page is the real record.

⚠ Before you run it, know this