Farbe wärmer oder kälter machen
Dieses Werkzeug verschiebt die visuelle Temperatur einer Hex-Farbe durch eine einfache, reproduzierbare RGB-Anpassung.
Im Browser ausführen – kostenlos
Ein positiver Wert erhöht Rot und verringert Blau; ein negativer Wert bewirkt das Gegenteil. Grün bleibt unverändert, und jedes Ergebnis wird auf den gültigen Bereich von 0 bis 255 begrenzt. Das direkte Verfahren eignet sich für vorhersehbare Palettenvarianten, reproduzierbare Änderungen an Design-Tokens und leicht prüfbare Transformationen, ohne ein subjektives Farbmodell oder eine angenäherte Kelvin-Umrechnung zu verwenden.
Wählen Sie eine Farbe und einen vorzeichenbehafteten Wert
Beginnen Sie mit einer drei- oder sechsstelligen Hex-Farbe, wahlweise mit vorangestelltem Doppelkreuz. Die Kurzschreibweise wird vor der Berechnung erweitert, sodass #69C exakt wie #6699CC behandelt wird. Wählen Sie anschließend eine ganze Zahl zwischen -255 und 255. Ein positiver Wert erzeugt ein wärmeres Ergebnis: Er wird zu Rot addiert und von Blau abgezogen. Ein negativer Wert erzeugt ein kälteres Ergebnis, weil er Rot verringert und Blau erhöht. Bei null wird die normalisierte Ausgangsfarbe zurückgegeben und die Richtung als unverändert bezeichnet. Der Grünkanal bleibt bewusst erhalten. Diese eng gefasste Regel macht den Vorgang in einem Designsystem leicht erklärbar, testbar und wiederholbar. Sie soll weder eine physische Lichtquelle simulieren noch Kelvin-Werte umrechnen. Stattdessen liefert sie eine kontrollierte Kanalanpassung, deren Wirkung sichtbar ist und deren Berechnung in Browser und API identisch bleibt. Verwenden Sie kleine Absolutwerte für dezente Varianten und größere Werte, wenn Sie einen deutlich warmen oder kühlen Farbstich erzielen möchten.
Verstehen Sie Begrenzung und deterministische Ausgabe
RGB-Kanäle dürfen weder unter 0 fallen noch 255 überschreiten. Deshalb begrenzt das Werkzeug jeden angepassten Rot- oder Blauwert auf diesen gültigen Bereich. Wenn Sie etwa eine Farbe erwärmen, deren Rotkanal bereits nahe 255 liegt, kann das Ergebnis bei 255 stehen bleiben, statt einen unmöglichen Wert zu erzeugen. Blau sinkt währenddessen weiter bis auf 0. Beim Abkühlen gilt die spiegelbildliche Regel. Die Begrenzung ist wichtig, weil unkontrollierte Arithmetik überlaufen oder ungültige Farbcodes erzeugen kann. Hier gehört sie zum veröffentlichten Verhalten und macht Randfälle sicher und vorhersehbar. Die Antwort enthält die normalisierte ursprüngliche Hex-Farbe, die neue sechsstellige Hex-Farbe in Großbuchstaben, den vorzeichenbehafteten Verschiebungswert, eine Richtungsangabe und die endgültigen RGB-Kanäle. Weder Netzwerk, Zufall, aktuelle Uhrzeit, Profilumrechnung noch verborgener Zustand beeinflussen die Berechnung. Gleiche Eingaben liefern daher stets gleiche Ausgaben. Der Wert muss eine endliche ganze Zahl sein; Dezimalzahlen, numerische Zeichenketten, unendliche Werte, fehlende Angaben und Zahlen außerhalb des festgelegten Bereichs werden abgelehnt und nicht stillschweigend gerundet.
Setzen Sie Temperaturverschiebungen in der Farbarbeit ein
Eine deterministische Verschiebung ist besonders nützlich, wenn ein Team verwandte Farben benötigt, ohne einen undurchsichtigen Bearbeitungsschritt einzuführen. Sie können eine Akzentfarbe für herbstliche Gestaltung erwärmen, einen neutralen Ton für einen Oberflächenzustand abkühlen oder zusammengehörige Varianten für eine Themenvorschau erzeugen. Weil Grün erhalten bleibt und Rot sowie Blau bis zum Erreichen einer Grenze symmetrisch verändert werden, lässt sich jedes Ergebnis auf eine kurze Regel zurückführen. Das ist wertvoll in Skripten, Token-Pipelines, Snapshot-Tests und Systemen zur Inhaltserstellung, in denen manuelle Änderungen mit einem Farbwähler kaum reproduzierbar wären. Sie können außerdem mehrere Stärken vergleichen: Senden Sie dieselbe Ausgangsfarbe mit unterschiedlichen ganzen Zahlen und speichern Sie den zurückgegebenen Wert neben dem jeweiligen Ergebnis. Beachten Sie, dass dies eine stilistische RGB-Transformation ist, keine chromatische Adaption und keine wahrnehmungsgleichmäßige Anpassung. Zwei Farben können sich beim gleichen Wert optisch unterschiedlich stark verändern, besonders wenn ein Kanal an eine Grenze stößt. Nutzen Sie für präzise Farbwissenschaft einen geeigneten Workflow mit verwalteten Farbräumen. Zum schnellen, transparenten und wiederholbaren Erwärmen oder Abkühlen gewöhnlicher Hex-Farben ist diese begrenzte Berechnung vorgesehen.
Anwendungsfälle
Warme und kühle Themenvarianten erstellen
Wenden Sie vorzeichenbehaftete Werte auf gemeinsame Design-Tokens an, damit beide Varianten einer prüfbaren Regel folgen.
Akzentfarben einer Kampagne anpassen
Erwärmen Sie einen vorhandenen Akzent für saisonale Motive oder kühlen Sie ihn für eine ruhigere Bildwirkung ab.
Reproduzierbare Farbänderungen automatisieren
Nutzen Sie dieselbe ganze Zahl in Build-Skripten, Tests und Metadaten, ohne einen Farbwähler manuell zu bedienen.
Häufige Fragen
Was bewirkt ein positiver Verschiebungswert?
Er wird zu Rot addiert, von Blau abgezogen, lässt Grün unverändert und kennzeichnet das Ergebnis als wärmer.
Wie machen Sie eine Farbe kälter?
Verwenden Sie einen negativen Wert. Er verringert Rot und erhöht Blau um seinen Absolutbetrag.
Was geschieht, wenn ein Kanal seinen Bereich überschreitet?
Angepasste Rot- und Blauwerte werden auf 0–255 begrenzt, sodass stets eine gültige RGB-Farbe entsteht.
Rechnet das Werkzeug eine Farbtemperatur in Kelvin um?
Nein. Es verschiebt deterministisch die RGB-Kanäle einer vorhandenen Hex-Farbe und modelliert keine physische Lichtquelle.
Darf der Verschiebungswert Dezimalstellen enthalten?
Nein. Er muss eine endliche ganze Zahl von -255 bis einschließlich 255 sein. Ungültige Werte werden abgelehnt.
Was kostet die Nutzung der API?
Jede API-Anfrage kostet $0.002. Das Browserwerkzeug führt dieselbe deterministische Berechnung lokal aus.
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/temperature-shift \
-H "Authorization: Bearer $KIT_KEY" \
-H "Content-Type: application/json" \
-d '{"color":"#6699CC","shift":32}'const res = await fetch("https://api.kit.forhosting.com/color/temperature-shift", {
method: "POST",
headers: {
"Authorization": `Bearer ${process.env.KIT_KEY}`,
"Content-Type": "application/json"
},
body: JSON.stringify({
"color": "#6699CC",
"shift": 32
})
});
const { task_id } = await res.json();import os, requests
res = requests.post(
"https://api.kit.forhosting.com/color/temperature-shift",
headers={"Authorization": f"Bearer {os.environ['KIT_KEY']}"},
json={
"color": "#6699CC",
"shift": 32
},
)
task_id = res.json()["task_id"]<?php
$res = file_get_contents("https://api.kit.forhosting.com/color/temperature-shift", false, stream_context_create([
"http" => [
"method" => "POST",
"header" => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
"content" => '{"color":"#6699CC","shift":32}',
],
]));
$task = json_decode($res, true);body := bytes.NewBufferString(`{"color":"#6699CC","shift":32}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/color/temperature-shift", body)
req.Header.Set("Authorization", "Bearer "+os.Getenv("KIT_KEY"))
req.Header.Set("Content-Type", "application/json")
res, _ := http.DefaultClient.Do(req)Beispiel-Anfrage
{
"color": "#6699CC",
"shift": 32
}Beispiel-Antwort
{
"task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
"type": "color.temperature_shift",
"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.
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. |