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.

Animation de logo : tracé, révélation, morphing v1.0.0

Utilisez cette ressource pour animer un logo pour un site, une vidéo ou un écran de démarrage

Nouveau

  • 508 téléchargements
  • 118 mentions J'aime
  • 150 sauvegardes

Gratuit

Installer avec la CLI

Dans un terminal, depuis le dossier voulu :

npx --yes palatekit@latest install logo-animation

Sans option, la skill va dans ~/.agents/skills/ ; ajoutez --agent claude-code (ou codex, cursor…) pour viser un agent.

Première fois : connectez la CLI avec

npx --yes palatekit@latest login

L'agent choisit une seule technique adaptée à votre logo (tracé du contour, révélation par masque, apparition par morceaux, morphing, boucle), respecte sa géométrie et sa zone de protection, et livre un fichier HTML autonome avec une image finale fixe. Si vous avez un jingle, il cale l'arrivée du logo sur le pic sonore, puis il vérifie le rendu image par image. Vous obtenez une animation de marque courte, de 0,8 à 2,5 secondes.

Mise à jour le 2 novembre 2026

Carte titrée : animation de logo par tracé, révélation ou morphing.

Caractéristiques

Guides d'installation
Génère avec
Le modèle de votre agent
Utilise
  • GSAP ou dotLottie selon la technique choisie (facultatif)
Licence
MIT

Ressources similaires

Tout voir
  • Gratuit

    Vidéo

    Fenêtre d'application et zoom

    • 365365 téléchargements
    • 125125 mentions J'aime
    • 188188 sauvegardes
    Compatible avec
    • Claude Code
    • Codex
    • Cursor
    • et 3 autres
    + HyperFrames
  • Gratuit

    Vidéo

    Un seul grand chiffre

    • 463463 téléchargements
    • 223223 mentions J'aime
    • 100100 sauvegardes
    Compatible avec
    • Claude Code
    • Codex
    • Cursor
    • et 3 autres
    + HyperFrames
  • PRO

    Vidéo

    PalateKit Motion, la bibliothèque

    • 338338 téléchargements
    • 198198 mentions J'aime
    • 249249 sauvegardes
    Compatible avec
    • Claude Code
    • Codex
    • Cursor
    • et 3 autres
    + HyperFrames
  • PRO

    Vidéo

    Trois barres face à face

    • 348348 téléchargements
    • 133133 mentions J'aime
    • 182182 sauvegardes
    Compatible avec
    • Claude Code
    • Codex
    • Cursor
    • et 3 autres
    + HyperFrames
  • PRO

    Vidéo

    Avant / après au curseur

    • 322322 téléchargements
    • 248248 mentions J'aime
    • 238238 sauvegardes
    Compatible avec
    • Claude Code
    • Codex
    • Cursor
    • et 3 autres
    + HyperFrames
  • PRO

    Vidéo

    Carrousel de trois cartes

    • 418418 téléchargements
    • 157157 mentions J'aime
    • 101101 sauvegardes
    Compatible avec
    • Claude Code
    • Codex
    • Cursor
    • et 3 autres
    + HyperFrames
  • PRO

    Vidéo

    Échange en bulles

    • 564564 téléchargements
    • 127127 mentions J'aime
    • 161161 sauvegardes
    Compatible avec
    • Claude Code
    • Codex
    • Cursor
    • et 3 autres
    + HyperFrames
  • PRO

    Vidéo

    Liste qui se coche

    • 442442 téléchargements
    • 233233 mentions J'aime
    • 160160 sauvegardes
    Compatible avec
    • Claude Code
    • Codex
    • Cursor
    • et 3 autres
    + HyperFrames

Ce que vous obtenez

  • SKILL.md traduit en français : principes, carte des techniques, calage sur le son, supports et vérification
  • references/logo-patterns.md (en anglais) : code de chaque technique, tableaux de durées et règles de zone de protection
  • Un modèle de fichier HTML autonome qui fige n'importe quel instant pour le relire
  • Une liste de contrôle avant livraison

Pour qui

  • Intro ou signature d'une vidéo de marque
  • Apparition du logo en haut d'une page d'accueil
  • Écran de démarrage ou animation de chargement d'une application

Pas pour qui

  • Redessiner le logo lui-même
  • Motion design long en plusieurs scènes

Étiquettes

  • logo
  • animation
  • svg
  • lottie
  • identité de marque

À propos

Vous dites

« Anime notre logo SVG : le contour se dessine, puis le nom apparaît, en moins de deux secondes. »

Carte titrée : animation de logo par tracé, révélation ou morphing.

Skill publiée par iart-ai sous licence MIT, traduite par PalateKit.

Voir plus

Prérequis

À préparer
Le logo en SVG et Le jingle de la marque, s'il existe
Dépendances
GSAP ou dotLottie selon la technique choisie (facultatif)

Comment l'utiliser

  1. Fournissez le logo en SVG, et le jingle s'il existe
  2. Indiquez l'effet souhaité et le support : site, vidéo ou application
  3. Relisez les images de début, de milieu et de fin, puis validez

Aperçu du contenu

Fichiers

  • LICENSE1,1 Ko
  • NOTICE-PALATEKIT.md0,4 Ko
  • references/logo-patterns.md8,1 Ko
  • SKILL.md9,5 Ko

Origine et licence

Modifié par PalateKit

Auteur
iart-ai
Source
github.com/iart-ai/motion-design-skills/tree/3c129f769d90a1328c209c386492333c9ac62312/skills/logo-animation
Licence
MIT

Notice

Version modifiée de « logo-animation » (iart-ai, 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

Les scripts d'aide cités dans la skill sont-ils fournis ?

Non, le dossier scripts/ du dépôt d'origine n'est pas livré. La vérification fonctionne avec la commande Playwright indiquée dans la skill, ou en ouvrant le fichier avec ?t=… dans un navigateur.

Mon logo est un PNG, est-ce gênant ?

Le tracé et le morphing demandent un SVG. Avec un PNG, l'agent se limite aux fondus, changements d'échelle et masques.