Duotone-Farbgenerator
Aus zwei Farben eine Duotone-Verlaufskarte erstellen – mit CSS und Bildvorschau
도구를 불러오는 중…
🔒 Alles läuft zu 100 % in Ihrem Browser. Ihre Dateien und Eingaben werden niemals auf einen Server hochgeladen.
Wähl eine dunkle und eine helle Farbe, und das Tool erstellt daraus eine Duotone-Verlaufskarte sowie eine fünfstufige Farbskala. Du kannst den CSS-Verlaufscode und das Duotone-CSS als Overlay kopieren, und wenn du ein Foto hochlädst, wird es direkt im Browser in echtes Duotone umgewandelt und in der Vorschau angezeigt.
Anleitung
- Drück auf eine Vorlage oder wähl selbst eine dunkle und eine helle Farbe, um die beiden Töne festzulegen.
- Stell den Verlaufswinkel ein, um die Fließrichtung der Farben zu bestimmen.
- Hol dir den Code mit „Verlauf kopieren" oder „Duotone-CSS kopieren".
- Lädst du ein Foto hoch, siehst du das in beide Farben umgewandelte Ergebnis und kannst es als PNG speichern.
FAQ
- Was genau ist Duotone?
- Eine Farbkorrekturtechnik, die nur die Helligkeitsinformation eines Fotos behält, die dunklen Bereiche in die erste und die hellen in die zweite Farbe umwandelt und es so in zwei Tönen darstellt. Sie wird oft für Magazine, Albumcover und Web-Banner genutzt, um eine einheitliche Stimmung zu erzeugen.
- Was unterscheidet die CSS-Methode von der Bildumwandlung?
- Das CSS-Overlay (grayscale + mix-blend-mode) lässt das Originalbild unverändert und lässt es nur am Bildschirm wie Duotone aussehen. Die Bildumwandlung mappt die Pixelwerte tatsächlich um und erzeugt eine fertige Datei, die sich auch speichern lässt.
- Wird das hochgeladene Foto an einen Server gesendet?
- Nein. Das Einlesen, die Farbumwandlung und das Speichern laufen komplett im Browser (auf einem Canvas) ab, es wird keine Datei auf einen Server hochgeladen. Je größer der Kontrast der beiden gewählten Töne, desto deutlicher das Ergebnis – behalte das im Hinterkopf.