"Abdunkeln" einer Farbe, sodass sie dem Original entspricht, wenn sie transparent gemacht wird

Wenn Sie eine Farbe teilweise transparent machen, wird sie natürlich heller (vorausgesetzt, sie befindet sich auf einem weißen Hintergrund). Ich möchte diesem Verhalten entgegenwirken, indem ich eine Farbe "abdunkele", sodass das Endergebnis, wenn ich es auf einem weißen Hintergrund transparent mache, mit der ursprünglichen Farbe identisch ist.

Grundsätzlich möchte ich den Effekt der Transparenz kompensieren. Und ich habe keine Ahnung, wie ich das machen würde. Ich habe versucht, mit einigen Zahlen in den Parametern der Farbe zu spielen, aber ich konnte nicht finden, was ich tun sollte.

Dies ist möglicherweise nur mit Worten schwer zu verstehen, daher habe ich eine visuelle Erklärung dessen erstellt, was ich erreichen möchte.

Geben Sie hier die Bildbeschreibung ein

Was ich erreichen möchte, ist das höchste Quadrat.

Oh, bevor mir ein Schlauer sagt, ich solle einfach das tun, was ich auf diesem Bild getan habe, wurde das Beispiel natürlich gefälscht, indem ein Stück transparentes Orange ausgeschnitten wurde, um es über den Bereich zu legen, in dem sich der "Stab" mit einem einfarbigen Quadrat überlappt. Natürlich kann diese Lösung nicht auf unregelmäßigere oder sich ändernde Formen angewendet werden und wird die weißen Bereiche eines Bildes nicht verarbeiten.

Falls es wichtig ist, was ich damit versuche, ist ein Webdesign in Adobe Illustrator, das natürlich letztendlich aus HTML und CSS bestehen würde.

Antworten (3)

Sie können die verschiedenen Mischmodi ausprobieren, wenn einer davon nahe genug kommt, aber ansonsten benötigen Sie separate Objekte. Sie können die Überblendung nicht wirklich nur für einen Teil eines einzelnen Objekts ändern.

RGB CMYK

Natürlich gibt es in HTML/CSS keine Mischmodi, also müssen Sie entweder Transparenz verwenden oder nicht und wahrscheinlich auch dort auf mehrere Objekte zurückgreifen.

CSS hat Mischmodi, aber die Browserunterstützung ist begrenzt. Siehe html.adobe.com/webplatform/graphics/blendmodes/browser-support
Ähm, ich spreche nicht davon, die Überblendung eines Teils eines Objekts zu ändern. So habe ich das visuelle Beispiel gefälscht. Was ich tun möchte, ist im Wesentlichen entgegenzuwirken, wie Transparenz meine Farbe auf einem weißen Hintergrund aufhellt. Ein bisschen wie Algebra ausgedrückt, wäre es BaseColor- 10%opacity+ x+ WhiteBackground= BaseColor, und das Ziel ist es, zu finden x, und das Ziel ist, x nicht undurchsichtig zu machen. Zum Beispiel habe ich so etwas wie das gemacht, was ich wollte, indem ich 10 % von jedem R-, G- und B-Wert abgezogen habe, aber das war es nicht ganz. Sättigung und Leichtigkeit taten es auch nicht.
Haben Sie versucht, mit der Pipette in dem Bereich, der die gewünschte Farbe enthält, bei gedrückter Umschalttaste zu klicken? Wenn Sie bei gedrückter Umschalttaste mit der Pipette klicken, wird die Farbe auf dem Bildschirm aufgenommen , im Gegensatz zur Farbe des Objekts selbst.
@ariene: Christopher Johns Antwort deutet ein wenig darauf hin, macht es aber nicht explizit: Er verwendet das HSB-Farbmodell und kompensiert die Sättigung durch die Höhe der Deckkraft (ähnlich wie bei Ihrem RGB-Algorithmus).
@Scott Entschuldigung für die lange Verzögerung. Diese Frage habe ich ganz vergessen. Entschuldigung, es sieht so aus, als würde das Pipettenwerkzeug nicht dieselbe Farbe erzeugen. Bisher ist die einzige Arbeitsmethode, die ich sehe, ein Quadrat mit der Farbe mit voller Deckkraft hinter die Farbe mit 90 % Deckkraft zu legen.

Wenn Sie ein Objekt haben, dem Sie eine Deckkraft von 90 % verleihen, führen Sie 10 % der Farbe unter diesem Objekt ein. Wenn Sie Ihr Originalobjekt mit 100 % Deckkraft (keine Transparenz) nehmen und dieselbe Hintergrundfarbe in einer Ebene davor mit 10 % Deckkraft platzieren, erhalten Sie theoretisch die gleichen 90 % bis 10 %. Verhältnis, was zu derselben Farbe wie die halbtransparente Originalfarbe führt.

Wenn Sie das Ergebnis des nicht transparenten Originals mit den 10% darüber nehmen, ist dies Ihre "abgedunkelte" oder "aufgehellte" Version der Originalfarbe.

Es kann manchmal mit einigen Mischmodi funktionieren ... ... wie Sie am "Regenbogen-Streifen" sehen können, ist es nicht wirklich flexibel. Du brauchst sie aber. Ich bezweifle, dass dies nur mit Deckkraft funktioniert.colorKeeperBeispiel: Hartes Licht



Bearbeiten: Es funktioniert irgendwie mit der Deckkraft ... colorKeeperBeispiel: Deckkraft
... nur habe ich es umgekehrt gemacht.
Hier funktioniert es anscheinend, indem die Sättigung des 90% transparenten Bildes um 10 erhöht wird. Das heißt, wenn die Originalfarbe bereits 100% Sättigung hat, funktioniert es nicht (auch wenn eine andere Farb-BG verwendet wird, wie John erwähnt hat). hab es trotzdem herausgefunden..

Entschuldigung für die Verspätung. Diese Frage habe ich ganz vergessen.
"Abdunkeln" einer Farbe, sodass sie dem Original entspricht, wenn sie transparent gemacht wird
AntwortenHierDatenschutz-Bestimmungen1y, 0v