Skip to main content

Colors

The color palette for Calendso outlines the consistent set of colors we use to build our interfaces.

Name	Hex Code	Preview
`gray-50`	#F8F8F8
`gray-100`	#F5F5F5
`gray-200`	#E1E1E1
`gray-300`	#CFCFCF
`gray-400`	#ACACAC
`gray-500`	#888888
`gray-600`	#494949
`gray-700`	#3E3E3E
`gray-800`	#313131
`gray-900`	#292929

`utility-error-50`	#FEF2F2
`utility-error-100`	#FEE2E2
`utility-error-200`	#FECACA
`utility-error-300`	#FCA5A5
`utility-error-400`	#F87171
`utility-error-500`	#EF4444
`utility-error-600`	#DC2626
`utility-error-700`	#B91C1C
`utility-error-800`	#991B1B
`utility-error-900`	#7F1D1D

`utility-warning-50`	#FFF7ED
`utility-warning-100`	#FFEDD5
`utility-warning-200`	#FED7AA
`utility-warning-300`	#FDBA74
`utility-warning-400`	#FB923C
`utility-warning-500`	#F97316
`utility-warning-600`	#EA580C
`utility-warning-700`	#C2410C
`utility-warning-800`	#9A3412
`utility-warning-900`	#7C2D12

`utility-success-50`	#ECFDF5
`utility-success-100`	#D1FAE5
`utility-success-200`	#A7F3D0
`utility-success-300`	#6EE7B7
`utility-success-400`	#34D399
`utility-success-500`	#10B981
`utility-success-600`	#059669
`utility-success-700`	#047857
`utility-success-800`	#065F46
`utility-success-900`	#064E3B