44 k vues

Rocket Pricing

Rocket Pricing : grille de fonctionnalités animée pensée pour une landing page SaaS, construite avec React, Tailwind CSS, Framer Motion.

Landing pages SaaS Grilles bento React Tailwind CSS Framer Motion TypeScript Vite

Obtenir une version renforcée de ce prompt

Prompt

Personnaliser

Build a `PricingSection` React component that matches the spec below exactly.

## Stack & global setup

- React 18 + Vite + TypeScript, TailwindCSS, `framer-motion`, `clsx` + `tailwind-merge` exposed as `cn()` from `@/lib/utils`.
- Dark theme. Page background `#000000`. Font: Inter (`font-inter`). Icons: Google **Material Symbols Outlined** (loaded globally).
- Tailwind config must include semantic HSL tokens plus:
  ```ts
  theme.extend.colors.landing = {
    surface: "rgba(255,255,255,0.10)",
    "surface-hover": "rgba(255,255,255,0.16)",
    border: "rgba(255,255,255,0.10)",

Débloquer le Prompt Studio à vie

192 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: Material Symbols Outlined
Palette

Rocket Pricing

Prompt

Références similaires