Concentración
HTML + CSSFilter

Parfumkonzentration mit Zerstäuber

Ein Parfumflakon mit Quastenball: Wähl die Konzentration, und der Ball drückt eine passende Duftwolke heraus.

Einstellungen

16px
1x

Code

<div class="uvq05-at"><div class="bt" aria-hidden="true"><i class="ms"><i></i><i></i><i></i></i><i class="hd"></i><i class="nk"></i><i class="tb"></i><i class="bl"></i><i class="gl"><i class="lq"></i></i></div><fieldset><legend>Konzentration</legend><label><input type="radio" name="uvq05-at"><span><b>Eau de Cologne</b><small>2–5 % · 2 h</small></span></label><label><input type="radio" name="uvq05-at"><span><b>Eau de toilette</b><small>5–15 % · 4 h</small></span></label><label><input type="radio" name="uvq05-at" checked><span><b>Eau de parfum</b><small>15–20 % · 6 h</small></span></label><label><input type="radio" name="uvq05-at"><span><b>Extrait</b><small>20–30 % · 8 h</small></span></label></fieldset></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.

Markdown-Version mit dem ganzen Code, für KI-Assistenten

Mehr aus Filter

Alle ansehen: Filter

Wofür du ihn nutzen kannst

Parfümerien führen Eau de Cologne, Eau de Toilette, Eau de Parfum und Extrait, doch den Unterschied versteht man besser, wenn man ihn sieht. Dieser Radiofilter steht neben einem alten Zerstäuber aus CSS: Jede Wahl vertieft die Farbe der Flüssigkeit, drückt den umnetzten Ball und sprüht eine Wolke, deren Größe der Konzentration folgt. Ölanteil und Haltbarkeit stehen unter jedem Namen.

Die erste Farbe färbt Goldkragen und Netz, die zweite den Ball. Bearbeite die vier Optionen und ihre Farben für Körpersprays, Raumdüfte oder ätherische Öle, und senke die Geschwindigkeit für ein langsameres Sprühen.