contrast funksiyası

contrast funksiyası rəngin kontrastlığını tənzimləmək üçün istifadə olunur. O, rəngin ən açıq və ən tünd hissələri arasındakı fərqi artırır və ya azaldır, onu daha ifadəli və ya əksinə, daha sakit edir. 100% dəyəri rəngi dəyişməz qoyur. 100%-dən az dəyərlər kontrastlığı azaldır, 100%-dən çox dəyərlər isə artırır. 0% dəyəri tamamilə boz bir rəng yaradır.

Sintaksis

csscontrast(amount)

Nümunə

Göy rəng üçün müxtəlif dərəcəli kontrastlıq:

html<div class="box contrast-50">50% kontrast</div>
<div class="box contrast-100">100% kontrast</div>
<div class="box contrast-150">150% kontrast</div>
<div class="box contrast-200">200% kontrast</div>

css.box {
  width: 100px;
  height: 100px;
  margin: 10px;
  display: inline-block;
  color: white;
  text-align: center;
  line-height: 100px;
}

.contrast-50 {
  background: contrast(#3498db, 50%);
}

.contrast-100 {
  background: contrast(#3498db, 100%);
}

.contrast-150 {
  background: contrast(#3498db, 150%);
}

.contrast-200 {
  background: contrast(#3498db, 200%);
}

Результат:

Həmçinin bax