Ampel-Drücker
Der gelbe Kasten an der Fußgängerampel: Ein Druck lässt WARTEN aufleuchten, danach erscheint das grüne Ampelmännchen.
Einstellungen
Code
<div class="uvq01-xwk"><div class="sg" aria-hidden="true"><span class="w1">Warten</span><span class="w2"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><circle cx="13" cy="4" r="2" fill="currentColor"/><path d="M9 21l3-6 3 2v4"/><path d="M12 15l1-6-4 2-2 3"/><path d="M13 9l2.5 3 3 1"/></svg><span>Gehen</span></span></div><button class="pb" type="button" aria-label="Grün anfordern"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M18 11V6a2 2 0 0 0-4 0"/><path d="M14 10V4a2 2 0 0 0-4 0v2"/><path d="M10 10.5V6a2 2 0 0 0-4 0v8"/><path d="M18 8a2 2 0 1 1 4 0v6a8 8 0 0 1-8 8h-2c-2.8 0-4.5-.9-6-2.3l-3.6-3.6a2 2 0 0 1 2.8-2.8L7 15"/></svg></button><span class="lb" aria-hidden="true">Drücken</span><span class="sr" role="status"></span></div>Prompt für KI
Füg ihn in ChatGPT, Claude oder Cursor ein und der Baustein wird mit diesen Einstellungen an dein Projekt angepasst, auch ohne React.
Mehr aus Buttons
Alle ansehen: ButtonsWofür du ihn nutzen kannst
Wer schon einmal an einer Ampel gewartet hat, kennt dieses Ding: ein gelber Metallkasten mit Schrauben in den Ecken, ein schwarzer Taster mit Hand und eine Punktmatrix-Anzeige. Ein Druck lässt WARTEN rot aufblinken, kurz darauf wechselt die Anzeige zu einem grünen Ampelmännchen, das vor dem Zurücksetzen zu blinken beginnt. Jeder Wechsel wird Screenreadern angesagt. Lustig für Stadtführer, Mobilitäts-Apps und Anfrageprozesse.
Die Hauptfarbe ist der Kasten, standardmäßig Schulbusgelb, die Zweitfarbe das Licht für WARTEN. Der ganze Ablauf folgt der Geschwindigkeit, er kann sich also wie eine ruhige Vorstadtkreuzung oder wie die hektische Innenstadt anfühlen.