Якшо коротше:
Осьо бібліотека кольорів.
З одного з найпопулярніших фронтенд-фреймворків. Кольори з назвами і шейдами. Зібрані особисто мною в Figma-файл у вигляді змінних і, про всяк випадок, стилів.
¿Нашо?
Біда: Створюючи новий дизайн-файл / починаючи роботу над новим проектом, дизайнер інтерфейсів підбирає всі кольори наново: для кнопок, для фону апки, для фону картки, для body-тексту, для link-тексту, для обводки тьоті Соні, для всіх психоемоційних станів барсука Ігнатія (ховер, дізейблед). І це окєйно.
І я так робив. І бачив Бог, шо це добре, бо я вільний обирати кольори, які хочу. Але, через два мільйони нових файлів я помітив, шо то всьо одні й ті самі кольори я обираю in the end (it doesn't even matter): приблизно такий самий синій, приблизно такий самий темніший синій. І називаю я їх приблизно однаково: blue-100, blue-200, blue-da-ba-dee...
То нема сенсу кожного разу робити одну й ту саму роботу. Тим паче, якщо її вже зробили до вас за вас.
Рішення:
У Tailwind CSS є палітра кольорів. Вона може бути неідеальною. Але вона покриває потребу в initial кольорах — ті, які будуть на самому початочку. Цю палітру можна розширювати потім: додавати кольори і шейди. АЛЕ. Як показує практика, це буде потрібно в невеликому відсотку випадків.
А Tailwind використовує просто гігантська кількість фронтенд-розробників. І вже і дизайнерів.
Як забрати собі в файл
Стилі: скопіюйте стилі з панелі налаштувань і вставте так само собі в панелі налаштувань або скопіюйте фрейм "Styles" з квадратиками і вставте в свій файл
Змінні: скопіюйте фрейм "Variables" і вставте в свій файл. Змінні підтягнуться (тре буде натиснути спливашку "Copy variables into this file").
Як подякувати
Підпишіться на все, шо тіки можна : )
Залиште коментар, якщо десь використали цю палітру і, якшо це спростило вам життя