HSV-zu-RGB-Konverter
Machen Sie aus einer HSV-Auswahl Bildschirmkanäle: Farbton 210, Sättigung 70 % und Hellwert 80 % ergeben rgb(61, 133, 204) oder #3d85cc, nach der klassischen Formel mit sechs Abschnitten. Kostenlos in Ihrem Browser.
- Kostenlos
- Läuft in Ihrem Browser
- Ohne Anmeldung
- Ihre Daten bleiben auf Ihrem Gerät
Im Browser ausführen – kostenlos
Rechenbeispiel
- H
- 210
- S
- 70
- Spannung (V)
- 80
- Hellwert
- 80
- Farbton
- 210
- Sättigung
- 70
- Widerstand (Ω)
- 61
Geben Sie den Farbton von null bis dreihundertsechzig Grad, die Sättigung von null bis einhundert Prozent und den Hellwert von null bis einhundert Prozent ein; das Werkzeug führt die klassische Sechs-Sektoren-Formel aus, liefert r, g und b von null bis zweihundertfünfundfünfzig und liefert außerdem eine Hex-Zeichenkette, eine einfügebereite CSS-Form rgb() sowie die schrittweise Zwischenrechnung der Chroma.
Was Farbton, Sättigung und Hellwert bedeuten
HSV steht für Farbton, Sättigung und Hellwert und entspricht der Art, wie viele Menschen in Grafikprogrammen Farben wählen. Der Farbton ist ein Winkel auf dem Farbkreis: 0 und 360 Grad sind reines Rot, bei 60 Grad liegt Gelb. Die Sättigung reicht von 0 % für reines Grau bis 100 % für die reinste Form des Farbtons, der Hellwert von 0 % für Schwarz bis 100 % für die hellste Version. Der Rechner macht daraus Rot, Grün und Blau von 0 bis 255 und liefert dazu einen Hexcode, einen rgb()-Wert und alle Zwischenschritte.
So rechnet der Konverter und das sollten Sie beachten
Zuerst werden Sättigung und Hellwert auf den Bereich von 0 bis 1 gebracht. Die Buntheit ist Hellwert mal Sättigung, bei HSV 210, 70 % und 80 % also 0,56. Der Farbkreis ist in sechs Abschnitte von je 60 Grad geteilt; je nach Abschnitt werden die Kanäle anders verteilt, dann wird ein Grundanteil von 0,24 addiert, alles mit 255 multipliziert und gerundet. Das Ergebnis ist rgb(61, 133, 204) oder #3d85cc. Der häufigste Fehler ist, HSL-Werte einzugeben: Die Helligkeit in HSL ist nicht dasselbe wie der Hellwert in HSV, und das Ergebnis wäre eine falsche Farbe.
Was HSV bedeutet und wie RGB abgeleitet wird
HSV steht für Farbton (Hue), Sättigung und Hellwert (Value)—ein zylindrisches Modell, das besser dazu passt, wie viele Menschen Farben in Design-Software wählen, als rohe Rot-Grün-Blau-Schieberegler. Der Farbton ist ein Winkel auf dem Farbkreis in Grad: null und dreihundertsechzig landen beide bei reinem Rot, sechzig ist Gelb, einhundertzwanzig ist Grün, einhundertachtzig ist Cyan, zweihundertvierzig ist Blau und dreihundert ist Magenta.
Die Sättigung ist, wie weit die Farbe vom Grau zum vollen Chroma liegt, hier als Prozentsatz von null (keine Farbe, nur Graustufen) bis einhundert (maximale Reinheit für diesen Farbton und diese Helligkeit). Der Hellwert ist die Helligkeit von null (Schwarz, unabhängig vom Farbton) bis einhundert (die hellste Version dieses Farbtons und dieser Sättigung).
Die Umrechnung nach RGB normalisiert zuerst Sättigung und Hellwert auf das Einheitsintervall null bis eins, berechnet Chroma C gleich V mal S, den Zwischenwert X aus der Bruchposition in einem Sechzig-Grad-Sektor und den Abgleich m gleich V minus C, und weist dann das geordnete Tripel der geprimten Kanäle je nach dem Sechzig-Grad-Sektor zu, in den der Farbton fällt. Zuletzt wird jeder Kanal mit zweihundertfünfundfünfzig skaliert und ganzzahlig gerundet.
Das ist derselbe Algorithmus, der in Computergrafik-Kursen gelehrt und von unzähligen Color-Pickern genutzt wird; diese Capability implementiert ihn deterministisch, damit Referenztests und Unterrichts-Lösungsschlüssel stabil bleiben. Den Unterschied zu HSL zu verstehen ist wichtig für alle, die das falsche Akronym gesucht haben: Helligkeit (Lightness) in HSL ist nicht dieselbe Achse wie der Hellwert in HSV, daher würden HSL-Zahlen in diesem Werkzeug falsches RGB erzeugen. Bevorzugen Sie HSV, wenn Ihre Quelle die Kanäle bereits als Farbton, Sättigung und Hellwert oder Helligkeit kennzeichnet.
Praktische Tipps, Grenzen und verwandte Suchen
Senden Sie bevorzugt dieselbe Prozentskala, die Ihr Design-Werkzeug für Sättigung und Hellwert exportiert hat; senden Sie keine Einheitsintervall-Brüche von null bis eins, ohne zuvor mit einhundert zu multiplizieren, weil eine Sättigung von null Komma sieben als weniger als ein Prozent gelesen würde und fast grau aussähe. Farbton dreihundertsechzig wird akzeptiert und als null behandelt, damit Exporte mit geschlossenem Rad nicht scheitern.
Bevorzugen Sie diese Capability, wenn Sie bereits HSV haben und nur die drei Kanal-Ganzzahlen, ein Hex-Token oder eine css-rgb()-Zeichenkette brauchen; wenn Ihre Pipeline von Hex startet, nutzen Sie einen eigenen Hex-zu-RGB-Pfad, und wenn Sie durch viele Räume hin und her müssen, nutzen Sie stattdessen einen Multi-Format-Konverter.
Anwendungsfälle
Color-Picker-Export nach CSS und Canvas
Entwickler nehmen HSV aus einem eigenen Picker oder Design-Export und erhalten exakte r-, g-, b-Ganzzahlen plus css- und Hex-Zeichenketten für Stylesheets und Canvas-Füllungen.
Die Sechs-Sektoren-HSV-Formel unterrichten
Studierende vergleichen handgeschriebene Sektor-, Chroma- und skalierte Kanäle mit dem deterministischen steps-Array, bevor sie die Grafik-Hausaufgabe abgeben.
Häufige Fragen
Welche Bereiche akzeptiert der HSV-zu-RGB-Konverter?
Farbton h von 0 bis 360 Grad, Sättigung s von 0 bis 100 Prozent und Hellwert v von 0 bis 100 Prozent.
Ist HSV dasselbe wie HSL?
Nein. Beide nutzen die Namen Farbton und Sättigung, aber der Hellwert (Value) ist nicht dasselbe wie Lightness. Dieses Werkzeug implementiert nur HSV; füttern Sie keine HSL-Tripel und erwarten korrektes RGB.
Was stellen r, g und b dar?
Intensitäten der Kanäle Rot, Grün und Blau als Ganzzahlen von 0 bis 255.
Was passiert, wenn die Sättigung außerhalb 0–100 liegt?
Der Wert wird nicht geklemmt. Fehlgeschlagene Validierung wird nicht berechnet.
Was ergibt HSV 210, 70 %, 80 % in RGB?
Rot 61, Grün 133 und Blau 204, also rgb(61, 133, 204) oder #3d85cc als Hexcode. Die Zwischenschritte der Rechnung werden mit angezeigt, damit Sie sie nachvollziehen können.
Verwandte Tools
Für Entwickler — API-Zugang
Alles auf dieser Seite ist auch per API verfügbar. Dieser Abschnitt richtet sich an Teams, die es in ihre eigenen Systeme einbinden möchten; alle anderen nutzen einfach das Tool oben.
Endpunkt
Authentifizierung per Bearer-Token. Ein einziger POST stellt die Aufgabe in die Warteschlange; das Ergebnis erhalten Sie per Webhook oder über einen signierten Link.
Aufruf aus Ihrem Stack
curl -X POST https://api.kit.forhosting.com/color/hsv-rgb \
-H "Authorization: Bearer $KIT_KEY" \
-H "Content-Type: application/json" \
-d '{"h":210,"s":70,"v":80}'const res = await fetch("https://api.kit.forhosting.com/color/hsv-rgb", {
method: "POST",
headers: {
"Authorization": `Bearer ${process.env.KIT_KEY}`,
"Content-Type": "application/json"
},
body: JSON.stringify({
"h": 210,
"s": 70,
"v": 80
})
});
const { task_id } = await res.json();import os, requests
res = requests.post(
"https://api.kit.forhosting.com/color/hsv-rgb",
headers={"Authorization": f"Bearer {os.environ['KIT_KEY']}"},
json={
"h": 210,
"s": 70,
"v": 80
},
)
task_id = res.json()["task_id"]<?php
$res = file_get_contents("https://api.kit.forhosting.com/color/hsv-rgb", false, stream_context_create([
"http" => [
"method" => "POST",
"header" => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
"content" => '{"h":210,"s":70,"v":80}',
],
]));
$task = json_decode($res, true);body := bytes.NewBufferString(`{"h":210,"s":70,"v":80}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/color/hsv-rgb", body)
req.Header.Set("Authorization", "Bearer "+os.Getenv("KIT_KEY"))
req.Header.Set("Content-Type", "application/json")
res, _ := http.DefaultClient.Do(req)Beispiel-Anfrage
{
"h": 210,
"s": 70,
"v": 80
}Beispiel-Antwort
{
"task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
"type": "color.hsv_rgb",
"status": "queued",
"_links": {
"result": "/tasks/tsk_…/result"
}
}Die API arbeitet asynchron: Sie erhalten sofort eine task_id. Polling ist mit 1 Anfrage pro Sekunde erlaubt.
Preis
Der Preis steht auf der Seite – keine Tokens, keine Credits. Fehlgeschlagene Aufgaben werden nicht berechnet.
Limits
h_min | 0 |
h_max | 360 |
s_min | 0 |
s_max | 100 |
v_min | 0 |
v_max | 100 |
Fehler
| HTTP | Code | Bedeutung |
|---|---|---|
401 | unauthorized | Der API-Schlüssel fehlt oder ist ungültig – prüfen Sie den Authorization-Header (Bearer). |
402 | insufficient_balance | Ihr Guthaben reicht für diese Aufgabe nicht aus – Aufladungen verfallen nicht. |
404 | unknown_type | Unbekannter Aufgabentyp – prüfen Sie das Feld „type“ gegen den Katalog. |
429 | rate_limited | Zu viele Anfragen – warten Sie kurz; Polling ist mit 1 Anfrage pro Sekunde erlaubt. |
Technische Hinweise
Ein HSV-zu-RGB-Konverter nimmt eine Farbe, beschrieben durch den Farbton auf dem Rad, die Sättigung als Prozentsatz reiner Chroma und den Hellwert als Helligkeit, und mappt diese drei Zahlen auf die ganzzahligen Kanäle Rot, Grün und Blau, die jedes Display, jede Canvas-API und jedes Design-Token-System noch nativ spricht. Sättigung außerhalb des Bereichs null bis einhundert wird mit einem klaren Fehler invalid_input abgelehnt, statt eine abgeschnittene Farbe zu erfinden.
So rufen Sie die API auf und was zurückkommt
Senden Sie einen JSON-Body mit drei erforderlichen endlichen Zahlen: h für den Farbton in Grad von null bis dreihundertsechzig (Aliasse hue und H), s für die Sättigung als Prozentsatz von null bis einhundert (Aliasse saturation und S), und v für den Hellwert als Prozentsatz von null bis einhundert (Aliasse value, V und brightness). Umgebende Zahlenstrings, die einem strengen endlichen Zahlenmuster entsprechen, werden akzeptiert und wie JSON-Zahlen coercert. Bei Erfolg echoet die Antwort gerundete h, s und v zusammen mit den Aliassen hue, saturation und value, ganzzahlige Felder r, g und b mit den Aliassen red, green und blue, ein rgb-Array aus drei Zahlen, eine kleingeschriebene Hex-Zeichenkette mit führendem Hash, eine css-Zeichenkette der Form rgb(r, g, b), eine css_hsv-Zeichenkette, die die Eingabeprozente zusammenfasst, einen Sektorindex von null bis fünf für den genutzten Sechzig-Grad-Eimer, eine kurze englische Nachricht und ein steps-Array, das Normalisierung, Chroma, Sektorzuweisung und finale Skalierungszeilen zum Debuggen oder Lehren zeigt. Fehlgeschlagene Validierung—fehlende Felder, nicht-endliche Zahlen, Farbton außerhalb von null bis dreihundertsechzig, Hellwert außerhalb von null bis einhundert oder Sättigung außerhalb von null bis einhundert—liefert invalid_input und wird nie berechnet. Die Preisgestaltung ist pauschal $0.002 pro erfolgreicher Anfrage mit Einheiten-Item und null marginalem Einheitspreis.
Praktische Tipps, Grenzen und verwandte Suchen
Beim Schreiben von Unit-Tests decken Sie mindestens reines Rot bei voller Sättigung und vollem Hellwert ab, ein Mid-Sektor-Blau wie zweihundertzehn Grad mit teilweiser Sättigung, ein Grau mit Sättigung null, bei dem nur der Hellwert den RGB-Grauton ändert, ein Schwarz mit Hellwert null, das den Farbton ignoriert, und eine absichtlich außerhalb von null bis einhundert liegende Sättigung, damit der invalid_input-Pfad nicht regressiert. Diese Seite zielt auf Personen, die nach einem HSV-zu-RGB-Konverter, Farbton Sättigung Hellwert zu Rot Grün Blau oder einem kostenlosen HSV-Farbrechner online suchen; sie ist kein HSL-Konverter, kein Hex-zu-RGB-Werkzeug, kein Palette-Extraktor aus Bildern und keine volle Color-Management-Suite mit LAB oder CMYK. Fehlgeschlagene Tasks, die invalid_input zurückgeben, verbrauchen kein vorausbezahltes Guthaben, was explorative Skripte und Formularvalidierung günstig hält, während Lernende unvollkommene Zwischenablage-Werte einfügen oder absichtlich die Sättigungsgrenzen prüfen.
Integrationsbeispiele
Unit-Tests für Theme- und Palette-Fixtures
Erzeugen Sie bekannte RGB-Tripel aus HSV-Fixtures, damit visuelle Regression und Marken-Token-Tests stabile Kanalwerte absichern und Out-of-Range-Sättigung ablehnen.
Technische Fragen
Ist der HSV-zu-RGB-Konverter kostenlos?
Das Browser-Werkzeug ist kostenlos und läuft lokal. API-Aufrufe nutzen vorausbezahltes KIT-Guthaben zu $0.002 pro erfolgreicher Anfrage; fehlgeschlagene Tasks werden nie berechnet.