Toutes les ressources premium et membres pour 8,99 €/mois, en abonnement sans engagement. Voir les offres

PalateKit

Menu

Demander une ressource

Décrivez en une phrase la ressource qui vous manque. Nous vous écrirons quand elle sera publiée.

0 / 280

Débloquer PalateKit

Tout débloquer

Offre

Le paiement vaut acceptation de nos conditions générales de vente.

Paiement sécurisé par Stripe. Reçus et factures envoyés par e-mail.

Content de vous revoir

Connectez-vous pour installer, télécharger ou sauvegarder cette ressource. Un compte gratuit suffit pour les ressources gratuites.

Texte remplacé mot à mot par coupes franches v1.0.0

Utilisez cette ressource pour remplacer une phrase mot à mot avec des coupes nettes

Nouveau

  • 384 téléchargements
  • 193 mentions J'aime
  • 240 sauvegardes

Gratuit

Installer avec la CLI

Dans un terminal, depuis le dossier voulu :

npx --yes palatekit@latest install staircase-word-cut-transition

Première fois : connectez la CLI avec

npx --yes palatekit@latest login

L'agent place dans votre page un composant React (Tailwind) qui remplace un texte mot par mot avec des coupes franches décalées en escalier. Vous fournissez les phrases ; vous obtenez un changement de message tranchant.

Choisie surtout par

Mise à jour le 2 novembre 2026

Caractéristiques

Guides d'installation
Génère avec
Le modèle de votre agent
Utilise
  • React
  • Tailwind CSS
Licence
MIT

Ressources similaires

Tout voir

Ce que vous obtenez

  • LISEZMOI.md, en français : mode d'emploi
  • shared-axis-y.stories.tsx : fichier d'origine de l'auteur
  • shared-axis-y.tsx : fichier d'origine de l'auteur
  • shared-axis-y.mdx : fichier d'origine de l'auteur

Pour qui

  • Titre éditorial qui change
  • Message de campagne
  • Slogans successifs d'une page

Pas pour qui

  • Un site sans React ni Tailwind CSS, sans adaptation
  • Un public sensible aux animations, sans ajouter prefers-reduced-motion

Étiquettes

  • texte
  • transition
  • mots
  • coupe
  • éditorial

À propos

Vous dites

« Remplace mon slogan mot à mot avec des coupes franches. »

Les mots d'une phrase sont remplacés l'un après l'autre en escalier, sans fondu.

Composant publié par pixelpoint sous licence MIT, fiche et mode d'emploi rédigés par PalateKit.

Voir plus

Prérequis

À préparer
Votre projet React avec Tailwind CSS et Vos couleurs et vos textes
Dépendances
React et Tailwind CSS

Comment l'utiliser

  1. Copiez shared-axis-y.tsx dans le dossier de composants de votre projet React.
  2. Vérifiez que Tailwind CSS est configuré dans le projet.
  3. Demandez à l'agent de placer le composant dans la page et de l'adapter à votre marque.

Aperçu du contenu

Fichiers

  • animata/text/shared-axis-y.stories.tsx0,5 Ko
  • animata/text/shared-axis-y.tsx2,7 Ko
  • content/docs/text/shared-axis-y.mdx1,5 Ko
  • LICENSE1,1 Ko
  • LISEZMOI.md0,8 Ko
  • NOTICE-PALATEKIT.md0,4 Ko

Origine et licence

Modifié par PalateKit

Auteur
pixelpoint
Source
github.com/codse/animata/tree/25c27e5a874c60a56dcc1609df3b2c4f5f8456f8/animata/text/shared-axis-y.tsx
Licence
MIT

Notice

Version modifiée de « shared-axis-y » (pixelpoint, MIT) : traduction française et fiche par PalateKit.

Avis des utilisateurs

–

Aucune note pour l'instant

Chargement des avis…

Supprimer votre avis ?

Votre note et votre commentaire seront retirés de la fiche.

Questions fréquentes

Quels paquets installer ?

React et Tailwind CSS suffisent.

Fonctionne-t-il sans Next.js ?

Oui, dans tout projet React avec Tailwind CSS ; retirez seulement la directive "use client" si votre outil ne la connaît pas.