sepia()
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2016.
Die sepia() CSS Funktion konvertiert das Eingabebild in Sepia und verleiht ihm ein wärmeres, gelblich/braunes Aussehen. Das Ergebnis ist eine <filter-function>.
Probieren Sie es aus
filter: sepia(0);
filter: sepia(0.2);
filter: sepia(60%);
filter: sepia(1);
<section id="default-example">
<img
class="transition-all"
id="example-element"
src="/shared-assets/images/examples/firefox-logo.svg"
width="200" />
</section>
Syntax
sepia(amount)
Parameter
amountOptional-
Der Grad der Umwandlung, angegeben als
<number>oder<percentage>. Ein Wert von100%ist vollständig sepia, während ein Wert von0%die Eingabe unverändert lässt. Werte zwischen0%und100%sind lineare Multiplikatoren für den Effekt. Der Anfangswert für die Interpolation ist0. Der Standardwert ist1.
Formale Syntax
<sepia()> =
sepia( [ <number> | <percentage> ]? )
Beispiele
>Beispiele für korrekte Werte für sepia()
sepia(0) /* No effect */
sepia(.65) /* 65% sepia */
sepia() /* Completely sepia */
sepia(100%)
Spezifikationen
| Specification |
|---|
| Filter Effects Module Level 1> # funcdef-filter-sepia> |
Browser-Kompatibilität
Siehe auch
Die anderen <filter-function> Funktionen, die in Werten der filter und backdrop-filter Eigenschaften verwendet werden können, umfassen: