.webp)

48 k vues
USD Halo
USD Halo : section hero animée pensée pour une landing page SaaS, construite avec React, Tailwind CSS, TypeScript.
Build a premium, fintech-style landing page for a stablecoin product called "Halo / USD Halo" using React + TypeScript + Vite + Tailwind CSS, with lucide-react for icons. No other UI libraries. Background color of the page is #F5F5F5. Global Setup Use TT Norms Pro as the primary font, loaded via @font-face from /fonts/tt-norms-pro-regular.woff2 (weight 400) and /fonts/tt-norms-pro-semibold.woff2 (weight 600), with font-display: swap. Apply it to html, body, and inherit on *. Tailwind base + components + utilities at the top of src/index.css. Page wrapper: flex flex-col bg-[#F5F5F5]. The first section (Navbar + Hero) is wrapped in a h-screen flex flex-col overflow-hidden container. Inner content max width across sections: max-w-[88rem] mx-auto. Custom Logo Icon Create an SVG component LogoIcon using currentColor, viewBox 0 0 256 256, with this path (a stylized "halo" mark made of two interlocking rounded squares): M 128.005 191.173 C 128.448 156.208 156.93 128 192 128 L 192 64 L 128 64 C 128 99.346 99.346 128 64 128 L 64 192 L 128 192 Z M 192 256 L 64 256 C 28.654 256 0 227.346 0 192 L 0 64 L 64 64 L 64 0 L 192 0 C 227.346 0 256 28.654 256 64 L 256 192 L 192 192 Z
Débloquer le Prompt Studio à vie
80 lignes masquées : architecture complète, classes Tailwind, animations et intégration vidéo.
Accès illimité à tous les prompts · Studio inclus · Paiement unique
- Palette

.webp)
.webp)