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 qui passe du flou à la netteté v1.0.0

Utilisez cette ressource pour faire apparaître un titre par une mise au point

Nouveau

  • 477 téléchargements
  • 164 mentions J'aime
  • 134 sauvegardes

Gratuit

Installer avec la CLI

Dans un terminal, depuis le dossier voulu :

npx --yes palatekit@latest install blur-to-focus-text

Première fois : connectez la CLI avec

npx --yes palatekit@latest login

L'agent place dans votre page un composant React (Tailwind) qui anime un texte d'un flou fort vers la netteté, puis d'un flou doux à la sortie. Vous réglez le texte et la durée ; vous obtenez une entrée de titre élégante.

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
  • focus-blur-resolve.stories.tsx : fichier d'origine de l'auteur
  • focus-blur-resolve.tsx : fichier d'origine de l'auteur
  • focus-blur-resolve.mdx : fichier d'origine de l'auteur

Pour qui

  • Titre d'une vidéo ou d'une présentation
  • Accroche d'une page de lancement
  • Nom de marque en ouverture

Pas pour qui

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

Étiquettes

  • texte
  • flou
  • netteté
  • titre
  • apparition

À propos

Vous dites

« Fais apparaître mon titre par une mise au point du flou vers le net. »

Un titre très flou qui devient net, puis se brouille doucement à la sortie.

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 focus-blur-resolve.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/focus-blur-resolve.stories.tsx0,5 Ko
  • animata/text/focus-blur-resolve.tsx3,2 Ko
  • content/docs/text/focus-blur-resolve.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/focus-blur-resolve.tsx
Licence
MIT

Notice

Version modifiée de « focus-blur-resolve » (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.