Revue de design16:30–17:15 · Estudio
HTML + CSSNotifications

Toast de rendez-vous agenda

Confirme un rendez-vous avec la date en vignette, le créneau horaire et une barre colorée qui pousse sur le côté.

Réglages

16px
1x

Code

<div class="uv-zcal"><button class="fire">Créer un événement</button><div class="toast"><time><b>25</b>SEP</time><span><b>Revue de design</b><small>16:30–17:15 · Estudio</small></span><i></i></div></div>

Prompt pour l’IA

Collez-le dans ChatGPT, Claude ou Cursor : le bloc sera adapté à votre projet avec ces réglages, même sans React.

Plus dans Notifications

Où l’utiliser

Pensé pour l'instant où une date est bloquée. Quand un client réserve une coupe sur le site d'un salon de coiffure, ou qu'un patient choisit un créneau chez le dentiste, le toast d'agenda affiche le jour, l'horaire et le lieu d'un coup d'œil. Il sert de petit reçu : la réservation est bien passée.

Indiquez toujours l'heure et le lieu ; la date seule ne suffit pas. Ajoutez un lien « Ajouter à l'agenda » si les gens en auront besoin plus tard. Et gardez la barre latérale aux couleurs de votre marque pour qu'on la reconnaisse.