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.

Bandeau « Nouveau niveau » rouge en relief v1.0.0

Utilisez cette ressource pour intégrer une notification de progression en relief qui s'enfonce au survol

Nouveau

  • 307 téléchargements
  • 108 mentions J'aime
  • 207 sauvegardes

Gratuit

Installer avec la CLI

Dans un terminal, depuis le dossier voulu :

npx --yes palatekit@latest install new-level-red-badge

Première fois : connectez la CLI avec

npx --yes palatekit@latest login

L'agent copie le HTML et le CSS fournis dans votre page, puis les adapte à votre contenu et à vos couleurs. Vous obtenez une notification de progression en relief qui s'enfonce au survol, sans bibliothèque ni JavaScript à ajouter. Le rouge est défini en HSL (teinte 6) dans les ombres et le fond : changez la teinte pour une autre couleur. Le texte « New level » se remplace dans le HTML.

Choisie surtout par

Mise à jour le 2 novembre 2026

Caractéristiques

Guides d'installation
Génère avec
Le modèle de votre agent
Licence
MIT

Ressources similaires

Tout voir

Ce que vous obtenez

  • MazontheMoon_curvy-mole-83.html : le HTML et le CSS de l'élément, prêts à copier
  • LISEZMOI.md : mode d'emploi en français pour l'intégrer et changer les couleurs
  • Un élément autonome, sans fichier externe

Pour qui

  • un message de réussite dans un cours en ligne
  • un badge de progression dans un jeu ou un quiz
  • une page de fidélité avec paliers

Pas pour qui

  • une alerte d'erreur sérieuse
  • un site sobre où le style ludique détonne

Étiquettes

  • notification
  • badge
  • niveau
  • étoiles

À propos

Vous dites

« Affiche un bandeau « Nouveau niveau » sur la page de profil de mon cours, dans le style de ma marque. »

Un bandeau rouge en relief avec deux étoiles clignotantes autour du texte « New level »

Animation publiée par MazontheMoon sur Uiverse.io sous licence MIT, documentée par PalateKit.

Voir plus

Prérequis

À préparer
La page ou le site où intégrer l'élément et Vos couleurs et vos textes

Comment l'utiliser

  1. Donnez à l'agent le fichier HTML de l'élément et la page à modifier.
  2. Précisez vos couleurs, vos textes et l'endroit où l'afficher.
  3. Ouvrez la page dans le navigateur et vérifiez le rendu et le survol.

Aperçu du contenu

Fichiers

  • LICENSE1,1 Ko
  • LISEZMOI.md0,7 Ko
  • NOTICE-PALATEKIT.md0,5 Ko
  • Notifications/MazontheMoon_curvy-mole-83.html2,6 Ko

Origine et licence

Modifié par PalateKit

Auteur
MazontheMoon
Source
github.com/uiverse-io/galaxy/tree/adbd2adde0a299a3956ea288fb444ec01891ca41/Notifications/MazontheMoon_curvy-mole-83.html
Licence
MIT

Notice

Version modifiée de « MazontheMoon_curvy-mole-83 » (MazontheMoon, 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

Comment l'ajouter à mon site ?

Copiez le HTML là où l'élément doit apparaître et le bloc de style dans votre feuille de style, ou demandez-le à l'agent.

Puis-je changer les couleurs et les textes ?

Oui. Le rouge est défini en HSL (teinte 6) dans les ombres et le fond : changez la teinte pour une autre couleur. Le texte « New level » se remplace dans le HTML.