Pocket — Mobile Stock Trading App — Référence de design web et prompt

# POCKET — TAILWIND PLUS APP-MARKETING TEMPLATE — STUDY / CLONE

> A SELF-CONTAINED, PIXEL-FAITHFUL REPRODUCTION OF THE TAILWIND PLUS "POCKET" APP-MARKETING TEMPLATE, REBUILT AS PLAIN HTML + CSS + VANILLA JS WITH NO BUILD STEP. EVERY PAGE, SECTION, HOVER STATE, AND SCROLL/ENTRANCE BEHAVIOUR IS RECREATED FROM RECON ARTIFACTS. ALL ASSETS (INTER FONTS, PHONE-FRAME SVG, NEWS LOGO SVGS, QR CODE) ARE VENDORED LOCALLY SO THE CLONE RUNS OFFLINE. THIS IS A STUDY OF SOMEONE ELSE'S DESIGN, BUILT FOR LEARNING — ALL CREDIT FOR THE ORIGINAL GOES TO TAILWIND PLUS (TAILWIND LABS).

REFERENCE: `https://tailwindcss.com/plus/templates/pocket/preview`

## SUMMARY

POCKET IS A PREMIUM MOBILE-APP MARKETING TEMPLATE FROM TAILWIND PLUS, SHOWCASED WITH A TONGUE-IN-CHEEK STOCK-TRADING APP ("INVEST AT THE PERFECT TIME"). IT IS A DARK-ACCENTED, MODERN MARKETING LANDING PAGE BUILT AROUND AN IPHONE MOCKUP: AN INTER SANS DISPLAY, A CYAN ACCENT (`#00B7D7`), A NEUTRAL-GRAY SCALE, AND ALTERNATING WHITE / GRAY-50 / GRAY-900 SECTION BANDS. A REUSABLE `PhoneFrame` SVG WRAPS HAND-DRAWN IN-APP SCREENS (CHART DEMO, INVITE FORM, STOCKS LIST, BUY-SHARES) THAT SWAP BEHIND THE FEATURE TABS. THE LIVE TEMPLATE IS A NEXT.JS + HEADLESS-UI + FRAMER-MOTION APP SERVED FROM `pocket.tailwindui.com`; THIS CLONE PRESERVES ITS EXACT MARKUP/COPY/IMAGERY, SELF-HOSTS THE INTER VARIABLE FONT, VENDORS THE PHONE-FRAME / NEWS-LOGO / QR-CODE SVGS, AND REPLACES THE PROPRIETARY NEXT/HEADLESS-UI/FRAMER RUNTIME WITH A SMALL HAND-WRITTEN CSS (TAILWIND-EQUIVALENT TOKENS) PLUS A VANILLA-JS SHIM THAT REIMPLEMENTS THE SAME BEHAVIOURS (MOBILE NAV POPOVER, AUTO-ROTATING PRIMARY-FEATURE TABS WITH CROSS-FADING PHONE SCREENS, PRICING MONTHLY/ANNUALLY TOGGLE, ANIMATED REVIEW MARQUEE, HOVER/FOCUS STATES).

THE BUILD SPANS 3 PAGES — THE MARKETING **HOME** PAGE (HERO, LOGO CLOUD, PRIMARY FEATURES, SECONDARY FEATURES, CTA, REVIEWS, PRICING, FAQS, FOOTER), A CENTERED-CARD **LOGIN** PAGE, AND A CENTERED-CARD **REGISTER** PAGE.