Variables

Variables is a set of global constraints that define the basic parameters of all our UI elements.

---

Colors

• Define the basic using colors

  Variable	Hex values	Variable	Hex values
  primary	#2D98DA	link	#2D98DA
  secondary	#1B1C1D	link-hover	#45AAF2

  • The color primary is same as the color blue we defined
  • The color secondary is same as the color black we defined
  • The color link is same as the color navy we defined
  • The color link-hover is same as the color inv-navy we defined

• Define a set of hex values for common named colors

  Variable	Hex values	Variable	Hex values	Variable	Hex values	Variable	Hex values
  red	#EB3B5A	inv-red	#FC5C65	purple	#8854D0	inv-purple	#A55EEA
  orange	#FA8231	inv-orange	#FD9644	pink	#E84393	inv-pink	#FD79A8
  yellow	#F7B731	inv-yellow	#FED330	brown	#E58E26	inv-brown	#FA983A
  green	#20BF6B	inv-green	#26DE81	grey	#A5B1C2	inv-grey	#D1D8E0
  teal	#0FB9B1	inv_teal	#2BCBBA	black	#1B1C1D	inv-black	#545454
  blue	#2D98DA	inv-blue	#45AAF2	white	#FFFFFF
  navy	#3867D6	inv-navy	#4B7BEC