tailwindcss-motion

tailwindcss-motion est un plugin Tailwind CSS développé chez RomboHQ. Il est décrit comme une bibliothèque d'animation simple mais puissante qui permet aux développeurs d'animer des éléments directement avec des classes utilitaires au lieu d'écrire des keyframes personnalisées. L'installation se fait via npm en tant que dépendance de développement, puis le plugin est ajouté au tableau plugins dans tailwind.config.js. Les styles require CommonJS et import ESM sont tous deux présentés. Le paquet est livré avec des définitions TypeScript, et les personnalisations de thème telles que motionScale et motionTimingFunction sont typées. L'idée centrale est une syntaxe en ligne pour animer chaque dimension. Par exemple, un effet de glissement et de fondu peut être obtenu avec des classes comme motion-translate-x-in-25 et motion-opacity-in-0, ou en utilisant un preset tel que motion-preset-fade. La documentation complète est hébergée sur docs.rombo.co/tailwind. Une extension Chrome complémentaire est proposée pour créer des animations visuellement dans le navigateur. Elle prend en charge les animations en boucle, l'enregistrement de presets réutilisables et l'export des résultats sous forme de classes Tailwind, de CSS pur ou de code Framer Motion. Le README renvoie à plusieurs exemples en direct sur le playground Tailwind Play, notamment une page d'atterrissage, une boîte de dialogue de chat, une dynamic island de batterie faible, des nuanciers de couleurs Apple, une boucle Rombo et des animations d'emoji. Il mentionne également Rombo comme une entreprise à un stade précoce qui construit des outils pour les interfaces interactives, et liste des ressources supplémentaires : un article de blog sur la création du plugin, un constructeur d'animateur et un port UnoCSS communautaire. Le dépôt contient uniquement le texte du README fourni ; aucune licence, directive de contribution, configuration de test ou donnée de benchmark n'est incluse dans le matériel.