રંગ કોડ જનરેટર અને પિકર

રંગ કોડ, ભિન્નતા, સુમેળો જનરેટ કરો અને કોન્ટ્રાસ્ટ રેશિયો તપાસો.

રંગ રૂપાંતર

HEX

#eca927

Fuel Yellow

HEX
#eca927
HSL
40, 84, 54
RGB
236, 169, 39
XYZ
49, 46, 8
CMYK
0, 28, 83, 7
LUV
74,68,71
LAB
74, 14, 70
HWB
40, 15, 7

વેરિયેશન્સ

આ વિભાગનો હેતુ તમારા પસંદ કરેલા રંગના 10% વધારામાં ટિન્ટ્સ (શુદ્ધ સફેદ ઉમેરવામાં) અને શેડ્સ (શુદ્ધ કાળો ઉમેરવામાં)ને ચોક્કસપણે ઉત્પન્ન કરવાનો છે.

પ્રો ટીપ: હોવર સ્ટેટ્સ અને શેડોઝ માટે શેડ્સનો ઉપયોગ કરો, હાઇલાઇટ્સ અને બેકગ્રાઉન્ડ માટે ટિન્ટ્સનો ઉપયોગ કરો.

શેડ્સ

તમારા મૂળ રંગમાં કાળો ઉમેરવાથી બનાવવામાં આવેલા ગાઢ વેરિયેશન્સ.

ટિન્ટ્સ

તમારા મૂળ રંગમાં સફેદ ઉમેરવાથી બનાવવામાં આવેલા હળવા વેરિયેશન્સ.

સામાન્ય ઉપયોગના કેસ

  • UI ઘટક સ્ટેટ્સ (હોવર, સક્રિય, અક્ષમ)
  • શેડોઝ અને હાઇલાઇટ્સ સાથે ઊંડાણ બનાવવું
  • સુસંગત રંગ સિસ્ટમ્સ બનાવવી

ડિઝાઇન સિસ્ટમ ટીપ

આ વેરિયેશન્સ એક સુસંગત કલર પેલેટની પાયાની રચના કરે છે. તમારા સમગ્ર પ્રોજેક્ટમાં સુસંગતતા જાળવવા માટે તેમને નિકાસ કરો.

રંગ સંયોજન

દરેક હાર્મનીનો પોતાનો મૂડ હોય છે. હાર્મનીઝનો ઉપયોગ કરીને એવા રંગ સંયોજનો વિચારો જે એકસાથે સારી રીતે કામ કરે છે.

કેમ ઉપયોગ કરવો

કોઈપણ રંગ પર ક્લિક કરીને તેનો હેક્સ મૂલ્ય નકલ કરો. આ સંયોજનો દ્રષ્ટિ હાર્મની બનાવવા માટે ગણિતીય રીતે સાબિત થયેલા છે.

એ કેમ મહત્વનું છે

રંગ હાર્મનીઝ સંતુલન બનાવે છે અને તમારા ડિઝાઇનમાં વિશિષ્ટ ભાવનાઓ જગાવે છે.

પૂરક

એક રંગ અને તેના વિપરીત રંગ ચક્ર પર, +180 ડિગ્રી હ્યુ. ઉચ્ચ વિરોધાભાસ.

#eca927
માટે શ્રેષ્ઠ: ઉચ્ચ-પ્રભાવ ડિઝાઇન, CTA, લોગોઝ

વિભાજિત-પૂરક

એક રંગ અને તેના પૂરકના બાજુમાં બે, મુખ્ય રંગના વિપરીત મૂલ્યથી +/-30 ડિગ્રી હ્યુ. સીધા પૂરક જેવા બોલ્ડ, પરંતુ વધુ બહુમુખી.

માટે શ્રેષ્ઠ: જીવંત પરંતુ સંતુલિત લેઆઉટ્સ

ત્રિકોણીય

રંગ ચક્ર પર સમાન અંતરે ત્રણ રંગો, દરેક 120 ડિગ્રી હ્યુ અલગ. શ્રેષ્ઠ છે કે એક રંગને પ્રભુત્વ આપો અને અન્યને ઉલ્લેખિત કરો.

માટે શ્રેષ્ઠ: રમૂજી, ઊર્જાવાન ડિઝાઇન

સમાન

સમાન પ્રકાશતા અને સંતૃપ્તિના ત્રણ રંગો જે રંગ ચક્ર પર બાજુમાં છે, 30 ડિગ્રી અલગ. સરળ સંક્રમણો.

માટે શ્રેષ્ઠ: પ્રકૃતિ-પ્રેરિત, શાંત ઇન્ટરફેસ

એકરંગી

સમાન હ્યુના ત્રણ રંગો સાથે પ્રકાશતા મૂલ્યો +/-50%. નાજુક અને પરિષ્કૃત.

માટે શ્રેષ્ઠ: ન્યૂનતમ, પરિષ્કૃત ડિઝાઇન

ચતુરંગી

બે સેટ પૂરક રંગો, જે 60 ડિગ્રી હ્યુ દ્વારા અલગ છે.

માટે શ્રેષ્ઠ: સમૃદ્ધ, વિવિધ રંગ યોજનાઓ

રંગ સિદ્ધાંતો

સંતુલન

એક મુખ્ય રંગનો ઉપયોગ કરો, સહાયક માટે ગૌણ અને હળવાશ માટે ઉલ્લેખિત કરો.

વિરોધાભાસ

વાંચનક્ષમતા અને ઍક્સેસિબિલિટી માટે પૂરતો વિરોધાભાસ સુનિશ્ચિત કરો.

સામંજસ્ય

રંગો એકસાથે કામ કરવા જોઈએ જેથી એકીકૃત દ્રશ્ય અનુભવ સર્જાય.

રંગ કોન્ટ્રાસ્ટ ચેકર

ટેક્સ્ટ વાંચી શકાય તેવા માટે WCAG એક્સેસિબિલિટી ધોરણોને પૂર્ણ કરે છે તે સુનિશ્ચિત કરવા માટે રંગ સંયોજનોનું પરીક્ષણ કરો.

ટેક્સ્ટ રંગ
પૃષ્ઠભૂમિ રંગ
કોન્ટ્રાસ્ટ
1.00
Fail
ખૂબ જ નબળું
નાનું ટેક્સ્ટ
✖︎
મોટું ટેક્સ્ટ
✖︎
WCAG ધોરણો
AA:સામાન્ય ટેક્સ્ટ માટે 4.5:1 નો લઘુત્તમ કોન્ટ્રાસ્ટ રેશિયો અને મોટા ટેક્સ્ટ માટે 3:1. મોટાભાગની વેબસાઇટ્સ માટે જરૂરી છે.
AAA:સામાન્ય ટેક્સ્ટ માટે 7:1 નો વધારાનો કોન્ટ્રાસ્ટ રેશિયો અને મોટા ટેક્સ્ટ માટે 4.5:1. શ્રેષ્ઠ એક્સેસિબિલિટી માટે ભલામણ કરેલ છે.
બધા ટેક્સ્ટ કદ માટે અપૂરતો કોન્ટ્રાસ્ટ - WCAG ધોરણો પર નિષ્ફળ.

ઉન્નત કોન્ટ્રાસ્ટ ચેકર

સ્લાઇડર્સ, બહુવિધ પૂર્વાવલોકનો અને વધુ સાથે સુક્ષ્મ-સુધારણા કરો

દરેક વ્યક્તિ એક પ્રતિભા છે. પરંતુ જો તમે માછલીને તેના ઝાડ પર ચડવાની ક્ષમતા દ્વારા જજ કરો છો, તો તે આખું જીવન માને છે કે તે મૂર્ખ છે.

- Albert Einstein

ટેકનિકલ ફોર્મેટ્સ

વ્યવહારુ ફોર્મેટ્સ

રંગ વિશ્લેષણ

અંધાપો સિમ્યુલેટર

સર્જનાત્મક પાસાઓ