15 k vues

HAUL!

HAUL! : pied de page animée pensée pour une landing page SaaS, construite avec React, Tailwind CSS, Framer Motion.

Landing pages SaaS Pieds de page React Tailwind CSS Framer Motion

Obtenir une version renforcée de ce prompt

Prompt

Personnaliser

Build a React functional component using Tailwind CSS, `motion/react` for animations, and `lucide-react` for icons.

**1. Typography & Setup:**
- Import the "Inter" font from Google Fonts (weights 400, 500, 600, 700) and set it as the default sans-serif font in the Tailwind config/CSS.
- The overall background of the page should be `#f8f9fa`.

**2. Top Spacer Section (View Below):**
- Create a section at the top of the page. Height should be `50vh` (on mobile/lg) and `30vh` (on md screens).
- Background color: `#FDFDFD`.
- Center a text element that says "View Below". The text should be `text-gray-300`, small font, bold, uppercase, with wide `tracking-[0.5em]`.
- Animate this text with Framer Motion to fade in from `opacity: 0` to `opacity: 1`.

Débloquer le Prompt Studio à vie

27 lignes masquées : architecture complète, classes Tailwind, animations et intégration vidéo.

Offre de lancement

Accès illimité à tous les prompts · Studio inclus · Paiement unique

Typographies: Links Area
Palette

HAUL!

Prompt

Références similaires