Jak zaczynałam tworzyć bloga to miałam niewielkie pojęcie o tym, czym jest html czy css i pamiętam jak bardzo mnie dziwiło, że w Internecie jest tak dużo kolorów, a ja umiem nazwać tak niewielu z nich. Zastanawiałam się jak to zrobić, żeby mój niebieski był bardziej głęboki, albo bardziej pastelowy, albo wpadający w jeszcze inny odcień, który gdzieś spotkałam. Okazało się, że wcale nie jest to takie trudne i bardzo łatwo można te kolory znaleźć i nawet dowiedzieć się jak je łączyć, żeby wyglądały estetycznie i nie męczyły oka.

COLOR-HEX

Głównym źródłem informacji o kolorach, ich nazwach w HTML i możliwościach wykorzystania w CSS stał się dla mnie ColorHex. Na tym portalu przede wszystkim dowiedziałam się jak wiele odcieni może posiadać jeden kolor i byłam (i w sumie jestem do tej pory) nim zachwycona. Jeżeli chodzi o dobór kolorystyki, jest to zdecydowanie najczęściej odwiedzana przeze mnie strona.

colorhex odcienie

colorhex css

Na Color-Hex możemy wyszukiwać kolory w różnych kombinacjach nawet wpisując nazwę danego koloru np.: black, white, red itp. wyszukiwarka działa tylko w języku angielskim więc nie próbujcie szukać po polsku 🙂 Color-Hex to też źródło informacji o wartościach jakie należy podać w RGB, HSL, HSV, CMYK, XYZ, Yxy, Hunter Lab i CIE-Lab.

ADOBE COLOR CC

Na stronie Adobe Color CC dowiemy się jak zapisać kolory w RGB i HEX (czyli nasz kolor potrzebny do zmiany html albo css). Przesuwając kursorem po kółku, aplikacja wyświetla nam kombinacje różnych barw pokazując te, które ze sobą współgrają, albo kontrastują. W zależności od tego jaką regułę wybierzemy i jak przesuniemy kursorem strzałki na kole kolorów, uzyskamy różne barwy w różnych zestawach kolorystycznych. Możemy też podejrzeć zapisane przez innych użytkowników zestawy kolorów co może być pomocne przy tworzeniu bloga albo strony i stać się dla nas podpowiedzią albo inspiracją.

adobe color

POZOSTAŁE STRONY Z KOLORAMI

Stron, na których możemy szukać wiedzy o kolorach, ich odcieniach czy nazwach jest całe mnóstwo. Dwie opisane powyżej wg mojej opinii są najlepsze i korzystam z nich najczęściej. Ale warte uwagi są też inne strony, na których znajdziemy informacje o sposobie zapisu, nazwie koloru, znajdziemy połączenia różnych zestawów barw itp. Do takich stron należą między innymi: KursHtmlColourLovers, Color-inspirator, ColorsOnTheWeb, Colorspire, Design-Seeds, ColorHunter.

ROZPOZNAWANIE KOLORÓW

Czasem jest tak, że zobaczymy gdzieś jakiś kolor i bardzo chcemy wykorzystać go na swoim blogu czy stronie. Wielu z Was, chociaż pewnie się nie przyznacie 😛 może mieć problem z uzyskaniem wiedzy na ten temat. Ja wykorzystuje do tego 3 narzędzia.

Po pierwsze PhotoShop. On niestety jest płatny, więc kupowanie go tylko do tego, żeby sprawdzić jaki jest kolor mija się z celem, a poza tym osoby, które go mają wiedzą jak to zrobić.

Po drugie Gimp. Program jest darmowy, więc można go pobrać ze strony producenta, a sprawdzenie koloru odbywa się za pomocą jednego z narzędzi o nazwie Pobranie koloru. Po odpaleniu programu otwieramy w nim konkretny obraz, albo wklejamy zrzut ekranu, klikamy w Pobranie koloru, następnie na kolor obrazu, który wkleiliśmy i po lewej stronie podświetla nam się barwa, którą nas interesuje. Jeżeli w nią klikniemy otworzy nam się okno ze szczegółami koloru w HSV, RGB i zobaczymy także kod, który należy umieścić na stronie (w html albo css).

Po trzecie Bighugelabs. To strona internetowa, która pokazuje nam zestaw kolorów z konkretnego obrazu. Wybieramy jakiś konkretny plik ze zdjęciem, grafiką itp. i klikamy Create palette. W zależności od tego jak bardzo będzie złożone zdjęcie czas oczekiwania może być nieco wydłużony, więc poczekajcie cierpliwie. Oczywiście nie jest to precyzyjne narzędzie, które zwróci nam 100% kolorów i odcieni znajdujących się na fotografii, ale na pewno może pomóc, szczególnie jeżeli nie chcemy instalować do tego, żadnego dodatkowego oprogramowania. Fajne jest to, że zdjęcie możemy wrzucić albo z komputera, albo wykorzystując portale społecznościowe: Facebook, Instagram i Flickr, a nawet mamy możliwość skorzystać ze zdjęć zamieszczonych w Dropbox.

bighugelabs zestaw kolorow

bighugelabs zestaw kolorow 02