Түсті түрлендіру
#8b00ff
Electric Violet
Вариациялар
Бұл бөлімнің мақсаты - сіз таңдаған түстің реңктерін (таза ақ қосылған) және көлеңкелерін (таза қара қосылған) дәл 10% қадаммен шығару.
Кәсіби кеңес: Көлеңкелерді hover күйі мен көлеңкелер үшін, реңктерді ерекшелеу және фон үшін қолданыңыз.
Көлеңкелер
Негізгі түсіңізге қара қосу арқылы жасалған қараңғы вариациялар.
Реңктер
Негізгі түсіңізге ақ қосу арқылы жасалған ашық вариациялар.
Жиі қолданылатын жағдайлар
- • UI компонент күйі (hover, белсенді, өшірілген)
- • Көлеңкелер мен ерекшелеулер арқылы тереңдік жасау
- • Тұрақты түс жүйелерін құру
Дизайн жүйесінің кеңесі
Бұл вариациялар үйлесімді түс палитрасының негізін құрайды. Жобаңыздың барлық бөлігінде бірізділікті сақтау үшін оларды экспорттаңыз.
Түс комбинациялары
Әрбір гармонияның өзіне тән көңіл-күйі бар. Жақсы үйлесетін түс комбинацияларын ойлап табу үшін гармонияларды қолданыңыз.
Қалай қолдану керек
Кез келген түсті басып, оның hex мәнін көшіріңіз. Бұл комбинациялар визуалды гармония жасау үшін математикалық дәлелденген.
Неліктен маңызды
Түс гармониялары тепе-теңдік жасайды және дизайндарда белгілі бір эмоцияларды тудырады.
Қосымша
Түс және оның түс дөңгелегіндегі қарама-қарсысы, +180 градус реңк. Жоғары контраст.
Бөлінген-қосымша
Түс және оның қосымшасына жақын екі түс, негізгі түске қарама-қарсы мәннен +/-30 градус реңк. Тікелей қосымша сияқты батыл, бірақ икемді.
Триадалық
Түс дөңгелегінде бірдей қашықтықта орналасқан үш түс, әрқайсысы 120 градус реңк айырмашылығымен. Бір түсті басым етуге және басқаларын акцент ретінде пайдалануға жақсы.
Аналогтық
Бірдей жарықтық пен қанықтылықтағы үш түс, түс дөңгелегінде 30 градус айырмашылығымен қатар орналасқан. Жұмсақ ауысулар.
Монохроматикалық
Бір реңктегі үш түс, жарықтық мәндері +/-50%. Нәзік және талғампаз.
Тетрадалық
Екі жиынтық қосымша түстер, 60 градус реңкпен бөлінген.
Түс теориясының принциптері
Теңгерім
Бір негізгі түсті қолданыңыз, екінші түспен қолдау көрсетіңіз және акцентті сирек қолданыңыз.
Контраст
Оқылымдылық пен қолжетімділік үшін жеткілікті контрастты қамтамасыз етіңіз.
Гармония
Түстер біртұтас визуалды тәжірибе жасау үшін бірге жұмыс істеуі керек.
Түс контрастын тексеру
Мәтіннің оқылуын қамтамасыз ету үшін WCAG қолжетімділік стандарттарына сәйкес келетін түс комбинацияларын тексеріңіз.
Мәтін түсі
Фон түсі
Контраст
WCAG стандарттары
Кеңейтілген контраст тексеруші
Слайдерлермен, бірнеше алдын ала қараулармен және тағы басқалармен дәл баптау
Әркім данышпан. Бірақ егер сіз балықты ағашқа өрмелеу қабілеті бойынша бағаласаңыз, ол өмір бойы өзін ақымақ деп сенеді.