úterý 6. prosince 2016

Pár kusých poznámek na téma barvičky a Sass

Tentokrát jen pár kusých poznámek na téma "barvičky a Sass". Řešil jsem automatické odvozování odstínů zadané "základní barvy" (pro pozadí) a nalezení kontrastní barvy, aby na tomto pozadí byl text vždy čitelný.

Sass je na práci s barvami vybavený dost dobře. Nastuduj si Module: Sass::Script::Functions — Sass Documentation. K výše uvedenému zadání mi byly užitečné hlavně funkce lightness($color), lighten($color, $amount) a darken($color, $amount).

Jak na kontrastní barvu jsem dohledal postupně na How to dynamically change text color based on a background color, Compass Color Contrast | Compass Documentation, How to get an accurate contrast color with Sass – Medium.

A dále pak na Sass text-contrast mixin, Sass text-contrast mixin a nakonec pro změnu Sass text-contrast mixin. To jsou různé verze téhož. Výsledek se mírně liší. Však se podívej.

Trochu barevné teorie načerpej z HSL and HSV na Wikipedia a Barevný model – Wikipedie.

S přepočtem barev v různých barevných modelech včetně HSV si pohraj s Color Calculator nebo složitějším Color Wheel - Color Calculator na Sessions College. Na vytvoření celých barevných schémat použij RGB Hex HSL HTML | Colour Calculator | Colour Scheme Tool nebo notoricky známý Barevný kruh | Barevná schémata - Adobe Color CC.


MAKE Magazine

Technology Review RSS Feeds

Nejčtenější příspěvky