Heim > Web-Frontend > js-Tutorial > Wie kann man Schwarz mithilfe von CSS-Filtern so umfärben, dass es mit jeder RGB-Farbe übereinstimmt?

Wie kann man Schwarz mithilfe von CSS-Filtern so umfärben, dass es mit jeder RGB-Farbe übereinstimmt?

Mary-Kate Olsen
Freigeben: 2024-10-19 14:07:30
Original
573 Leute haben es durchsucht

How to Recolor Black Using CSS Filters to Match Any RGB Color?

So wandeln Sie Schwarz nur mithilfe von CSS-Filtern in eine beliebige Farbe um

Problem:Wie färben Sie bei gegebener RGB-Zielfarbe Schwarz um ( #000) nur mit CSS-Filtern in diese Farbe umwandeln?

Lösung: Verwenden Sie die folgende Funktion, um eine Ziel-RGB-Farbe in eine CSS-Filterzeichenfolge umzuwandeln:

<code class="python">def css_filter(target_color):
  """Converts a target RGB color into a CSS filter string.

  Args:
    target_color: A tuple of three integers representing the target RGB color.

  Returns:
    A CSS filter string that transforms black into the target color.
  """

  # Convert the target RGB color to HSL.
  h, s, l = colorsys.rgb_to_hls(*target_color)

  # Calculate the CSS filter values.
  invert = 1 - (l / 100)
  sepia = 1 - s
  saturate = s / 100
  hue_rotate = h * 360
  brightness = l
  contrast = 1

  # Return the CSS filter string.
  return "filter: invert({0}%) sepia({1}%) saturate({2}%) hue-rotate({3}deg) brightness({4}%) contrast({5});".format(
      invert, sepia, saturate, hue_rotate, brightness, contrast)</code>
Nach dem Login kopieren

Das obige ist der detaillierte Inhalt vonWie kann man Schwarz mithilfe von CSS-Filtern so umfärben, dass es mit jeder RGB-Farbe übereinstimmt?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage