Про ColorTag
ColorTag — незалежний довідник іменованих кольорів, палітр і CSS-градієнтів для тих, хто щодня працює з кольором.
Навіщо цей сайт
Кожен, хто проєктує інтерфейси чи пише CSS, знає цю рутину: знайти колір в одному інструменті, перевести в HSL в іншому, перевірити контраст у третьому, підібрати акцент у четвертому і шукати відтінок для стану наведення в п’ятому. ColorTag збирає все це на одній сторінці для кожного кольору, і кожна цифра на ній обчислюється однаково, тож значення збігаються, де б ви їх не зустріли на сайті.
Сайт розрахований на дизайнерів інтерфейсів і графічних дизайнерів, фронтенд-розробників, ілюстраторів, тих, хто готує бренд до друку, і студентів, які вивчають теорію кольору. Він безкоштовний і не потребує реєстрації.
Що тут є
- Каталог кольорів: понад 1600 іменованих кольорів, для кожного — значення HEX, RGB, HSL, HSB і CMYK, текстовий опис, контраст на білому й чорному з рівнями WCAG, вісім колірних гармоній, пари та схожі відтінки.
- Добірки, що групують кольори за родиною відтінків, тоном (пастельні, глибокі, приглушені, неонові тощо), температурою і практичним застосуванням — наприклад, кольори, які добре читаються на білому.
- Статті: докладні матеріали, що пояснюють логіку за цифрами — від побудови палітри й вимірювання контрасту до підготовки кольорів до друку та темної теми.
Звідки дані
Список назв кольорів базується на поширених відкритих переліках: іменованих кольорах CSS і традиційних назвах із довідників фарб, текстилю та поліграфії. Назви перевірено й перекладено українською та російською вручну; якщо усталеної місцевої назви немає, ми обирали найбільш описовий переклад, а не дослівний.
Усе інше обчислюється з самого значення HEX:
- Перетворення в RGB, HSL, HSB і CMYK — за стандартними формулами. CMYK — це спрощене перетворення без ICC-профілю, тож сприймайте його як відправну точку для розмови з друкарнею, а не як специфікацію для друку.
- Коефіцієнти контрасту рахуються за визначенням відносної яскравості з WCAG 2.x і округлюються до двох знаків.
- Гармонії будуються поворотом тону на колірному колі HSL; для пар підбирається найближчий реальний колір каталогу до кожного ідеального гармонійного кута.
- Добірки призначаються автоматично за тоном, насиченістю, світлотою і контрастом — пороги описані на сторінці кожної добірки.
Редакційні принципи
Статті пишемо для практиків. Пояснюємо метод за кожною порадою, показуємо цифри й посилаємося на першоджерела, як-от настанови W3C з доступності, коли вони є. Якщо порада — емпіричне правило, а не стандарт, ми про це кажемо. Якщо помітили помилку в статті чи значенні, будь ласка, напишіть нам — виправлення публікуємо, щойно їх перевірено.
Як фінансується сайт
ColorTag безкоштовний і існує завдяки рекламі Google AdSense. Реклама чітко відділена від контенту і ніколи не впливає на те, які кольори чи інструменти ми описуємо. Як працюють рекламні cookie і як ними керувати, читайте в політиці конфіденційності та політиці cookie.
Контакти
Питання, виправлення та пропозиції нових кольорів чи статей надсилайте на contact@colorstag.blog.