وظيفة CSS sepia()

التعريف والاستخدام

CSS sepia() وظيفة المرشح تحويل الصورة إلى داكنة (لون أكثر دفئًا وأكثر بنيًا أو أصفر).

• 100% (أو 1) يجعل الصورة داكنة تمامًا
• 0% (أو 0) بدون تأثير

مثال

مثال 1

تحديد تأثيرات الداكنة المختلفة للصور:

#img1 {
  filter: sepia(1);
}
#img2 {
  filter: sepia(60%);
}
#img3 {
  filter: sepia(0.4);
}

تجربة شخصية

مثال 2

لتحديد sepia() مع backdrop-filter استخدام الخصائص معًا:

div.transbox {
  background-color: rgba(255, 255, 255, 0.4);
  -webkit-backdrop-filter: sepia(100%);
  backdrop-filter: sepia(100%);
  padding: 20px;
  margin: 30px;
  font-weight: bold;
}

تجربة شخصية

النصائح CSS

sepia(amount)

تفاصيل التقنية

دعم المتصفح

الرقم في الجدول يعني إصدار المتصفح الذي يدعم هذه الوظيفة تمامًا.

الصفحات المتعلقة

参考：هاوسسی فیلتر属性

参考：فنك CSS blur()

参考：فنك CSS brightness()

参考：فنك CSS contrast()

参考：فنك CSS drop-shadow()

参考：فنك CSS grayscale()

参考：فنك CSS hue-rotate()

参考：فنك CSS invert()

参考：CSS opacity() 函数

参考：CSS saturate() 函数