FP35 | Kelvin | FIT=B | Startups & tech | 3D & WebGL
TECHNIQUES: scroll scrub pin hover touch focus 3d rotate product card front back filter reveal mask motion font hero gsap lenis
BORN_HOOD_ADVICE: Material lighting and geometry behavior for faithful crown, not invented apparel mesh.
DESIGN_SIGNATURE: 's colors] The design The idea: a flagship product launch where one object, rendered live in 3D, is the whole show. Fonts: Manrope only, bold and tightly tracked for headlines, weight 200 for giant numerals. Colors: warm white #F5F3EF, graphite #1C1D1F, ember orange #FF6A2B for heat and buttons, ice blue #6BB7FF for cool, brushed steel #A8ACB1, linen #EBE7E0 for panels. Model the product in live 3D under bright studio light: a spun-brushed metal ring, a domed glass face, a display whose numbers and tick ring glow; show a drawn version if 3D is unavailable. Order: a hero with the product floating over a giant pale number, headline bottom left, preorder button bottom right; a pinned sequence where scrolling turns and tilts it through four poses while spec labels on thin leader lines float in around it and its glow shifts from ice blue to ember; a pinned day scrubbed by scrolling, with a huge clock, a color-coded temperature chart and the product's display following along; a drawn phone with floating notifications; savings on a rounded graphite panel with a giant gradient percentage, count-ups and a bar chart; materials beside a huge cropped close-up with a finish picker that recolors the model; a specs table beside a self-drawing technical drawing; preorder with options, a live total and an FAQ; a graphite footer with the name huge in brushed steel. Motion: on load the product spins in and its face wakes; headlines rise line by line; it glides between sections and light glints across the metal as you scroll.
HTML_SURFACE: headings=Warmth, by the degree.; Turn the ring. That's the manual.; A week of you. Then it just knows.; Every room, under one thumb.; It pays for itself by the second winter.; Made like a watch, not a gadget.; Every number, in one place.; Reserve yours for March.; Answered by the people who wired it.; Letters from the lab, four a year. | ids=fr, fl, ff, fg, fh, fs, kv, gl, menu, main, top, hero-title, design, obj-title, learns, learn-title, chart-t, tg, tga, tclip, app, app-title, savings, save-title, materials, mat-title, fin-l, specs, specs-title, preorder, buy-title, po-email, nl-email | functions=setMenu, objTick, fmt, learnTick, onScroll, total, setFinish, intro, reveals, go, boot, drawBack, drawDisplay, lathe, pickSlot, sizeCheck, frame
ORIGINAL_PROMPT: prompt/kelvin.md (SHA256 95df963e7dadc09ae88dd9f57ca38443924d94c1e175212667ab08810977fe85)
EXAMPLE_SOURCE: example/kelvin.html (SHA256 217c5f336e653a4b46fafb3f579bb05fadf8cfe69b8c89257f59bef71b52dbca)
FULL_RUNNABLE_OFFLINE_EXAMPLE: C:\Users\usapr\Documents\Reference Libraries\Futurepedia Claude Website Library\offline_examples\kelvin\index.html
DO_NOT_COPY: Demo facts/images/prices/logos; use only proven techniques respecting current BORN HOOD constraints.
