Open Foundry: добірка відкритих шрифтів
Безкоштовна добірка шрифтів із візуальними зразками, інформацією про авторів, ліцензіями та посиланнями на оригінальні проєкти.
Ресурси
Знаходьте корисне. Збирайте своє. Діліться знахідками.
Усі ресурси 101
SVGOMG: оптимізація SVG-файлів
Безкоштовний браузерний інтерфейс для SVGO: очищення SVG-коду, зменшення файлів, точні налаштування та порівняння результату.
Squoosh: стискання зображень у браузері
Безкоштовний інструмент для стискання, зміни розміру та конвертації зображень із порівнянням якості й локальною обробкою файлів.
Perfect Paragraph — гра про баланс типографіки
Налаштовуйте кегль, міжрядковий інтервал і ширину рядка в десяти вправах за навчальною моделлю типографічного трикутника Matej Latin.
Pixactly — тренажер відчуття піксельних розмірів
Намалюйте прямокутник заданої ширини й висоти на око та перевірте точність у п’яти раундах із детальним підсумком.
The Boolean Game — гра з векторними фігурами
Безкоштовна браузерна гра для практики булевих операцій: поєднуйте базові фігури та відтворюйте задані силуети в завданнях різної складності.
Color — гра для тренування відчуття кольору
Браузерна гра з пошуку заданих кольорів на час. Тренує розпізнавання відтінків, насиченості та комплементарних, аналогових, тріадних і тетрадних поєднань.
Kern Type — гра для тренування кернінгу
Безкоштовна браузерна гра для розвитку відчуття міжлітерних відстаней: розставляйте літери, отримуйте оцінку та порівнюйте результат зі зразком.
Can't Unsee — гра на уважність до деталей інтерфейсу
Порівнюйте схожі інтерфейси, знаходьте вдаліший варіант і тренуйте увагу до відступів, типографіки, вирівнювання та іконок.
Flexbox Froggy: гра для вивчення CSS Flexbox
Безкоштовна браузерна гра з 24 завданнями: пишіть CSS, розміщуйте жаб на листках латаття та вивчайте вирівнювання, порядок і перенесення flex-елементів.
The Bézier Game — практика роботи з пером і кривими
Безкоштовна браузерна гра, у якій потрібно обводити контури опорними точками та напрямними, використовуючи якомога менше вузлів.
Khroma — персональний пошук кольорових поєднань
Інструмент, який навчається на ваших кольорових уподобаннях і пропонує поєднання для типографіки, градієнтів, палітр та зображень.
Site of Sites: кураторська галерея вебдизайну
Безкоштовна галерея сайтів із фільтрами за індустрією, типом, стилем і платформою, тематичними добірками та посиланнями на живі проєкти.
Logoinspo: логотипи, знаки й вордмарки для натхнення
Кураторська галерея реальних і концептуальних логотипів із фільтрами за стилем, індустрією та кольором і посиланнями на авторів.
Awwwards Free Fonts — добірка шрифтів для дизайнерів
Візуальна добірка шрифтів від Awwwards із прикладами, тегами та переходами до авторів. Умови безкоштовного використання залежать від гарнітури.
Awwwards Portfolio: приклади сайтів-портфоліо
Велика добірка сайтів-портфоліо на Awwwards для дослідження композиції, взаємодії та презентації творчих робіт.
Logggos: галерея логотипів для дослідження брендів
Кураторська галерея логотипів із добірками за індустрією, типографікою, кольором і формою для пошуку візуальних референсів.
Neumorphism.io: генератор CSS-тіней для Soft UI
Безкоштовний генератор неоморфних поверхонь із налаштуванням кольору, форми, тіней та копіюванням CSS.
zoxilsi studio — mesh-градієнти та анімовані фони
Редактор сітчастих градієнтів із кривими Безьє, пресетами, ефектами та експортом у зображення, відео й код.
Glass3D — генератор скляних CSS-ефектів
Налаштовуйте розмиття, колір і текстуру скляних елементів інтерфейсу та копіюйте готовий CSS.
INKDRUM: симулятор ризографічного друку
Браузерний інструмент для ризографічних ефектів із кольоровими шарами, растрами, паперовими текстурами та експортом кольороподілів.
Symbl — тестування логотипів у різних умовах
Перевіряйте масштабування, розмиття, контрастні варіанти та застосування логотипа на іконках, візитках і мокапах.
Gradient Lab від Backgrounds Supply — генератор градієнтних фонів
Безкоштовний браузерний редактор градієнтних фонів із шейдерними режимами, налаштуванням палітри та експортом зображень і відео.
generative.graphics — генератор геометричних патернів
Створюйте рухомі геометричні композиції з керуванням сіткою, шумом, формами й кольорами та експортом PNG і WebM.