A high-contrast brutalist e-commerce storefront and design system for a fictional apparel label, Studio/Raw, that replaces container-heavy UI with typographic drama, atmospheric gradient blobs, and a sharp grid-based hierarchy. The warm palette pairs base cream (#E4E2DD) and ink (#1E1E1E) with an accent red-orange (#DB4A2B), warm orange, and soft pink. Clash Display drives all headings — hero at 18vw, 0.75 line-height, tight tracking — while Satoshi handles body, nav, and metadata. The vertically-scrolling page covers a fixed transparent nav, a blob-backdrop typographic hero, two category dividers, a borderless product grid, a campaign block, and a dark footer with a 10vw background year, all with an 0.8s cubic-bezier(0.16, 1, 0.3, 1) slide-up entrance. Generated with Claude Fable 5.
This is a static project — open index.html in a browser, or serve the folder:
python3 -m http.server 8000See prompt.md for the full build spec; demo.mp4 shows it in motion.
Part of the Templates collection in the claude-directory — an open-source gallery of AI-generated UI built with Claude Fable 5. Browse the live gallery.