Case library · Public evidence
No news summaries—only cases that point to finished work, creators, process, and original sources. Rankings, favorites, creator pages, and retests all grow from the same case.
.webp)
Creator MotionSites →
Build a single-page landing site for "SynapseX" -- a futuristic neural-AI interface product. The entire site uses a black background with white text…
Prompt
Build a single-page landing site for "SynapseX" -- a futuristic neural-AI…
Creator MotionSites →
…600&display=swap`. **Page shell:** - Body: white background `#ffffff`, 80px top/bottom + 20px left/right padding, flex centered, Inter font. - Globa…
Prompt
Build a "Core Features" marketing section as a single centered component…
.webp)
Creator MotionSites →
--- **Prompt:** Create a full-viewport section (100vh) that sits over a fixed background video. The section has no background color of its own -- it…
Prompt
--- **Prompt:** Create a full-viewport section (100vh) that sits over a…
.webp)
Creator MotionSites →
… single-page hero section using Vite. The entire page lives in `src/App.tsx`. No extra libraries beyond `react`, `react-dom`, `lucide-react`, and Ta…
Prompt
Build a React + TypeScript + Tailwind CSS single-page hero section using…
.webp)
Creator MotionSites →
…gh a soft circular mask on top of a base image. Match every detail below exactly. ### Fonts Add this to the top of `src/index.css`, then `@tailwind …
Prompt
Build a full-screen, dark-themed hero section for a geology brand called…
.webp)
Creator MotionSites →
… video, a responsive navbar, a mobile menu, and staggered-animated hero text. **Video Background:** - URL: `https://d8j0ntlcm91z4.cloudfront.net/use…
Prompt
Create a fullscreen hero landing page for a creative studio called…
Creator MotionSites →
…gsap` and `lucide-react`. No other UI libraries.** ### Fonts (in `src/index.css`) Import at the top of index.css BEFORE ` @tailwind ` directives: ``…
Prompt
**Build a fullscreen hero section in a Vite + React + TypeScript +…
Creator MotionSites →
…ot, and the main wrapper Font family: 'Kanit', sans-serif Global reset: box-sizing border-box, margin 0, padding 0 CSS class .hero-heading: gradient…
Prompt
Build a 3D Creator portfolio landing page for "Jack" using React,…
.webp)
Creator MotionSites →
… sm:p-4 md:p-6`. - Inside the root, one large rounded card with `rounded-2xl sm:rounded-3xl`, `overflow-hidden`. Heights: `min-h-[calc(100vh-24px)] …
Prompt
Build a single-page React + TypeScript + Vite + Tailwind site that is a…
Creator MotionSites →
Build a single-page hero landing page for a product called "Axon" — a platform that deploys digital workers for mundane workflows. The page is a ful…
Prompt
Build a single-page hero landing page for a product called "Axon" — a…
.webp)
Creator MotionSites →
…l line. --- ## ROOT CONTAINER (`.site-footer`) - Position relative, z-index 100, overflow hidden. - Background: `#000000`. Color: `#ffffff`. --- ## …
Prompt
--- Build a **Site Footer** for an aerospace company called "EngineTech."…
Creator MotionSites →
…a frosted-glass prompt card, and a navigation bar.** **Fonts (load in index.html `<head>`):** - Google Fonts link: `https://fonts.googleapis.com/css…
Prompt
**Build a single-page React + TypeScript landing page for a travel app…
Creator MotionSites →
…out:** - Full viewport height (`min-height: 100vh`), white background, flex column with `justify-content: space-between` - Fixed navbar at top (z-in…
Prompt
Create a full-screen hero section landing page using React, Vite, and…
.webp)
Creator MotionSites →
Build a pixel-faithful recreation of the landing CTA section. Use React 18 + Vite + TypeScript, TailwindCSS, `framer-motion`, `clsx` + `tailwind-mer…
Prompt
Build a pixel-faithful recreation of the landing CTA section. Use React…
Creator MotionSites →
… Lucide React (`ArrowRight` only). No other UI libraries. --- ### Fonts (exact) Load in `index.html`: 1. **Display / serif:** `P22 Mackinac W01 Book…
Prompt
Build a single full-viewport marketing landing page for **Boomerang**, a…
Creator MotionSites →
…h Tailwind CSS and Lucide React icons. **Phone Frame:** - Dimensions: 375px wide x 780px tall - Border radius: 52px - Background color: `#8a9aaa` - …
Prompt
Build a mobile wellness quiz screen inside a realistic phone frame…
.webp)
Creator MotionSites →
… Build a "Categories" section in React + Tailwind CSS with the following exact specifications: > > **Section Container:** > - Full-width `<section>`…
Prompt
--- **Prompt to recreate the "Categories" section:** > Build a…
Creator MotionSites →
Recreate this page **pixel-faithfully**. Single full-viewport hero. React + Tailwind CSS. No cards, no purple, no Inter/Roboto. Black/cream editoria…
Prompt
Recreate this page **pixel-faithfully**. Single full-viewport hero. React…
Creator MotionSites →
**Build a single-page HTML showcase displaying two iOS device frames (370x790px each) side by side on a neutral `#F4F4F4` stage. The stage auto-scal…
Prompt
**Build a single-page HTML showcase displaying two iOS device frames…
.webp)
Creator MotionSites →
…tup The page uses **"TT Norms Pro"** loaded via a stylesheet link in `index.html`: ```html <link href="https://db.onlinewebfonts.com/c/49bf5d043a27b…
Prompt
**Prompt:** Build a "Use Cases" section for a fintech stablecoin landing…
Creator MotionSites →
…t, Tailwind CSS, and Lucide React icons. The page must be a single `App.tsx` component. Use the Inter font (weights 400–900) loaded from Google Font…
Prompt
Build a full-screen animated 404 error page for a children's brand called…
.webp)
Creator MotionSites →
…ries. --- ### Font Load **Helvetica Regular** via this stylesheet in `index.html`: ``` https://db.onlinewebfonts.com/c/a64ff11d2c24584c767f6257e880d…
Prompt
Build a full-screen hero section for a fictional vinyl record label…
Creator MotionSites →
… + Vite + Tailwind CSS landing page with two full-screen sections for a luxury beauty/wellness brand called "Serene". Use TypeScript.** --- ### Font…
Prompt
**Build a React + Vite + Tailwind CSS landing page with two full-screen…
Creator MotionSites →
… FONT Use the font "Nimbus Sans TW01" loaded from this stylesheet in `index.html`: ``` https://db.onlinewebfonts.com/c/bb5de19d87c09a95216dc6ccd96e3…
Prompt
Build a full-viewport hero section for a SaaS landing page called…
