[swedax94]

Hey liebe Nonprintler,
da ich mich im Online Bereich nicht so auskenne, im Internet schon danach gesucht und nichts gefunden hab wende ich mich an euch.

Ist es mit CSS möglich eine Farbüberlagerung auf ein Bild anzuwenden (ähnlich wie bei Photoshop).

Um es deutlicher zu machen was ich genau meine, schreibe ich den Grund warum ich es brauche:
Auf einer Veranstaltungswebseite wird ein Logo als PNG eingebunden. Jedes Jahr hat diese Veranstaltung eine andere Farbe. Durch Ändern des Farbcodes in CMS (Contao) wird dadurch die Navigation sowie weitere Elemente auf der Seite die Farbe verändert. Nun wäre es gut wenn das Logo auch dem entsprechend variabel wäre. Der Kunde sollte nacher nur den Farbcode ändern und die Webseite passt sich dementsprechend an (inkl. Logo). Das wäre für den Kunden am einfachsten.

Hat jemand einen Lösungsvorschlag oder eine Idee wie ich das Problem mit dem Logo angehen könnte?

[qualidat]

Du kannst per CSS die Opazität (Parameter opacity: x; x im Bereich von 0...1 mit Punkt als Komma), deutsch "Undurchsichtigkeit" von Objekten festlegen. Default ist 1, also deckend, bei 0 ist es unsichtbar, dazwischen mehr oder weniger ...

Wie sich das optisch mischt, musst du ausprobieren. Selten ist es besonders schön, weil auch die Helligkeit und die Sättigung reduziert werden. Wahrscheinlich würden ein par Zeilen Javascript, angewandt auf ein Canvas, mehr bringen. Da könnte man Farbton, Sättigung und Helligkeit getrennt bearbeiten oder das Logo einfach in einer passenden Farbe automatisch neuzeichnen ...

[fyll]

Wenn du das Logo als SVG speicherst und einbindest, sollte es relativ stressfrei sein, den Farbcode in der .svg zu ändern.

Je nachdem wie das Logo aussiehst, könntest ihm evtl auch transparente Bereiche geben und über backgroundColor dann die Farbe ändern - oder eben mit <canvas/> arbeiten.

[swedax94]

Danke für die schnellen Vorschläge.

Das Problem dabei ist, dass das Logo im Hintergrund transparent bleiben sollte, also kann ich keine Background colour vergeben.
Nächstes Problem liegt darin das Logo ziemlich filligran ist und schwarzen Linien enthält, die erhalten bleiben sollten.
Hier ist ein Ausschnitt des Logos um es sich besser vorstellen zu können (das weiße im Logo sollte variabel sein):
Dropbox

[hilson]

Hab ich das richtig verstanden ... EIN Logo, welches EINMAL pro Jahr aktualisiert werden muß?

Natürlich wäre es schön/elegant, das auf diesem Wege zu machen. Mir persönlich stellt sich allerdings dabei die Frage, ob das den Zeitaufwand zur Entwicklung einer solchen Lösung rechtfertigt

[Zoro]

Das einzufärben sollte ja ein Aufwand von ca. 2 Minuten für dich sein...

[swedax94]

@Zoro Ja für den Kunde aber nicht.
@hilson Ja hast du Recht. Wahrscheinlich wäre über spezielle CMS Plugins etc. möglich aber die Entwicklungszeit rechnet sich nicht mit den Kosten.

Ich habe nun eine Lösung gefunden mit den Ideen von euch kombiniert.
Ich habe das Logo in den Background mit eingearbeitet und nur das Logo transparent gemacht.
Bsp. hier: Dropbox
Nun kann ich einen Background vergeben und das Logo färbt sich.



Danke für eure Ideen.

[Zoro]

Weisst du denn schon, was das für Hintergrundfarben sein können?
Geht man zum Beispiel von einem dunklen Rot oder sowas aus, wird man nicht mehr viel vom Logo lesen können...
Was spricht denn dagegen, das Logo einfach Schwarz-Weiss zu lassen? Beisst sich ja wahrscheinlich nicht mit dem Hintergrund.