Hàm contrast

Hàm contrast được sử dụng để điều chỉnh độ tương phản của màu sắc. Nó tăng hoặc giảm sự khác biệt giữa các phần sáng nhất và tối nhất của màu, làm cho màu trở nên nổi bật hơn hoặc ngược lại, tắt hơn. Giá trị 100% giữ nguyên màu sắc. Các giá trị nhỏ hơn 100% làm giảm độ tương phản, các giá trị lớn hơn 100% - làm tăng độ tương phản. Giá trị 0% tạo ra một màu xám hoàn toàn.

Cú pháp

contrast(amount)

Ví dụ

Các mức độ tương phản khác nhau cho màu xanh lam:

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

.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%);
}

Xem thêm

hàm brightness,
điều chỉnh độ sáng của màu sắc
hàm invert,
đảo ngược màu sắc