Farbwürfel

Dieses Tool zeichnet einen aus 360 Segmenten bestehenden Farbtonring auf einer HTML-Leinwand und ermöglicht die Auswahl eines Farbtons durch Klicken oder Ziehen auf dem Ring. Sättigung und Helligkeit werden über Schieberegler eingestellt, und die gewählte Farbe wird als Muster mit kopierbaren HEX-, RGB- und HSL-Zeichenketten angezeigt. Eine Reset-Schaltfläche stellt Farbton 0, Sättigung 100 und Helligkeit 50 wieder her.

1. Klicken oder ziehen Sie innerhalb des farbigen Rings, um den Farbton zu setzen; der Ring wird mit der aktuellen Sättigung und Helligkeit gezeichnet. 2. Passen Sie Hue (0-360), Saturation (0-100) und Lightness (0-100) mit den Schiebereglern oder den numerischen Eingaben an. 3. Beobachten Sie, wie die Preview-Muster und der Indikator auf dem Ring live aktualisiert werden. 4. Kopieren Sie HEX, RGB oder HSL über die Schaltflächen in der Karte Color Values. 5. Klicken Sie auf Reset, um zu den Standardeinstellungen zurückzukehren.

Das Rad ist eine 260px große Leinwand, die für Schärfe beim Gerätepixelverhältnis gezeichnet wird, mit einem äußeren Farbtonring und einem leeren Zentrum. Pointer-Ereignisse werden erfasst, sodass das Ziehen dem Cursor folgt; Klicks im inneren Loch oder außerhalb der Außenkante werden ignoriert. Ein kreisförmiger Indikator sitzt am gewählten Farbton und ist mit der aktuellen Farbe gefüllt. Der Farbton wird aus dem Winkel des Zeigers relativ zum Mittelpunkt abgeleitet, wobei 0deg oben liegt. Sättigung und Helligkeit verändern die Farben jedes Ringsegments, nicht die Geometrie.