Funkcija contrast

Funkcija contrast se uporablja za prilagajanje kontrastnosti barve. Poveča ali zmanjša razliko med najsvetlejšimi in najtemnejšimi deli barve, kar jo naredi bolj izrazito ali, nasprotno, bolj prigušeno. Vrednost 100% pusti barvo nespremenjeno. Vrednosti manjše od 100% zmanjšajo kontrastnost, vrednosti večje od 100% jo povečajo. Vrednost 0% ustvari popolnoma sivo barvo.

Sintaksa

contrast(amount)

Primer

Različne stopnje kontrastnosti za modro barvo:

<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>

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

Glejte tudi

funkcijo brightness,
ki uravnava svetlost barve
funkcijo invert,
ki obrne barve