Log inSign up

Colors

gray

#000000
hsl(0,0%,0%)
rgb(0,0,0)
1.0021.00
#1a1a1a
hsl(0,0%,10.2%)
rgb(26,26,26)
1.2117.40
#2c2c2c
hsl(0,0%,17.25%)
rgb(44,44,44)
1.5013.97
#404040
hsl(0,0%,25.1%)
rgb(64,64,64)
2.0310.37
#555555
hsl(0,0%,33.33%)
rgb(85,85,85)
2.827.46
#6b6b6b
hsl(0,0%,41.96%)
rgb(107,107,107)
3.945.33
#828282
hsl(0,0%,50.98%)
rgb(130,130,130)
5.463.84
#999999
hsl(0,0%,60%)
rgb(153,153,153)
7.372.85
#b2b2b2
hsl(0,0%,69.8%)
rgb(178,178,178)
9.902.12
#cbcbcb
hsl(0,0%,79.61%)
rgb(203,203,203)
12.941.62
#e5e5e5
hsl(0,0%,89.8%)
rgb(229,229,229)
16.671.26
#ffffff
hsl(0,0%,100%)
rgb(255,255,255)
21.001.00

slate gray

#0e0e0f
hsl(240,3.45%,5.69%)
rgb(14,14,15)
1.0919.29
#1f2023
hsl(225,6.06%,12.94%)
rgb(31,32,35)
1.2916.29
#303137
hsl(231.43,6.8%,20.2%)
rgb(48,49,55)
1.6212.96
#42434d
hsl(234.55,7.69%,28.04%)
rgb(66,67,77)
2.149.81
#555762
hsl(230.77,7.1%,35.88%)
rgb(85,87,98)
2.937.18
#696b78
hsl(232,6.67%,44.12%)
rgb(105,107,120)
3.975.28
#7e808e
hsl(232.5,6.61%,52.55%)
rgb(126,128,142)
5.373.91
#9496a3
hsl(232,7.54%,60.98%)
rgb(148,150,163)
7.152.94
#acadb8
hsl(235,7.79%,69.8%)
rgb(172,173,184)
9.422.23
#c4c5cd
hsl(233.33,8.26%,78.63%)
rgb(196,197,205)
12.221.72
#dddde2
hsl(240,7.94%,87.65%)
rgb(221,221,226)
15.521.35
#f6f6f7
hsl(240,5.88%,96.67%)
rgb(246,246,247)
19.441.08

blue

#11151b
hsl(216,22.73%,8.63%)
rgb(17,21,27)
1.1518.31
#192634
hsl(211.11,35.06%,15.1%)
rgb(25,38,52)
1.3715.35
#1f374f
hsl(210,43.64%,21.57%)
rgb(31,55,79)
1.7212.23
#264a6b
hsl(208.7,47.59%,28.43%)
rgb(38,74,107)
2.279.23
#305d86
hsl(208.6,47.25%,35.69%)
rgb(48,93,134)
3.046.92
#40719f
hsl(209.05,42.6%,43.73%)
rgb(64,113,159)
4.085.15
#5885b4
hsl(210.65,38.02%,52.55%)
rgb(88,133,180)
5.433.87
#749ac5
hsl(211.85,41.12%,61.37%)
rgb(116,154,197)
7.172.93
#92b0d3
hsl(212.31,42.48%,70%)
rgb(146,176,211)
9.372.24
#b2c6e0
hsl(213.91,42.59%,78.82%)
rgb(178,198,224)
12.051.74
#d1dceb
hsl(214.62,39.39%,87.06%)
rgb(209,220,235)
15.151.39
#f0f3f8
hsl(217.5,36.36%,95.69%)
rgb(240,243,248)
18.881.11

indigo

#0f1016
hsl(231.43,18.92%,7.25%)
rgb(15,16,22)
1.1118.99
#1c202f
hsl(227.37,25.33%,14.71%)
rgb(28,32,47)
1.3016.19
#28304b
hsl(226.29,30.43%,22.55%)
rgb(40,48,75)
1.6113.01
#344269
hsl(224.15,33.76%,30.78%)
rgb(52,66,105)
2.139.86
#425485
hsl(223.88,33.67%,39.02%)
rgb(66,84,133)
2.847.40
#5467a0
hsl(225,31.15%,47.84%)
rgb(84,103,160)
3.825.49
#6a7cb6
hsl(225.79,34.23%,56.47%)
rgb(106,124,182)
5.174.06
#8392c7
hsl(226.76,37.78%,64.71%)
rgb(131,146,199)
6.903.04
#9ea9d6
hsl(228.21,40.58%,72.94%)
rgb(158,169,214)
9.102.31
#bac1e1
hsl(229.23,39.39%,80.59%)
rgb(186,193,225)
11.801.78
#d6daed
hsl(229.57,38.98%,88.43%)
rgb(214,218,237)
15.111.39
#f2f3f8
hsl(230,30%,96.08%)
rgb(242,243,248)
18.951.11

violet

#130f15
hsl(280,16.67%,7.06%)
rgb(19,15,21)
1.1118.97
#261d2d
hsl(273.75,21.62%,14.51%)
rgb(38,29,45)
1.3016.20
#3a2b48
hsl(271.03,25.22%,22.55%)
rgb(58,43,72)
1.6212.97
#4f3963
hsl(271.43,26.92%,30.59%)
rgb(79,57,99)
2.1010.01
#65497f
hsl(271.11,27%,39.22%)
rgb(101,73,127)
2.817.47
#7a5b98
hsl(270.49,25.1%,47.65%)
rgb(122,91,152)
3.785.56
#9070ae
hsl(270.97,27.68%,56.08%)
rgb(144,112,174)
5.114.11
#a587c0
hsl(271.58,31.15%,64.12%)
rgb(165,135,192)
6.833.08
#baa0cf
hsl(273.19,32.87%,71.96%)
rgb(186,160,207)
9.022.33
#cdbbdd
hsl(271.76,33.33%,80%)
rgb(205,187,221)
11.751.79
#e1d6ea
hsl(273,32.26%,87.84%)
rgb(225,214,234)
15.011.40
#f5f2f8
hsl(270,30%,96.08%)
rgb(245,242,248)
18.941.11

magenta

#160e14
hsl(315,22.22%,7.06%)
rgb(22,14,20)
1.1118.97
#2e1a29
hsl(315,27.78%,14.12%)
rgb(46,26,41)
1.3016.20
#48253f
hsl(315.43,32.11%,21.37%)
rgb(72,37,63)
1.6113.03
#633057
hsl(314.12,34.69%,28.82%)
rgb(99,48,87)
2.0910.04
#7e3e6f
hsl(314.06,34.04%,36.86%)
rgb(126,62,111)
2.817.48
#984e86
hsl(314.59,32.17%,45.1%)
rgb(152,78,134)
3.775.57
#ae639c
hsl(314.4,31.65%,53.53%)
rgb(174,99,156)
5.064.15
#c17daf
hsl(315.88,35.42%,62.35%)
rgb(193,125,175)
6.823.08
#d198c2
hsl(315.79,38.26%,70.78%)
rgb(209,152,194)
8.982.34
#dfb5d3
hsl(317.14,39.62%,79.22%)
rgb(223,181,211)
11.691.80
#ecd3e4
hsl(319.2,39.68%,87.65%)
rgb(236,211,228)
15.001.40
#f8f1f6
hsl(317.14,33.33%,95.88%)
rgb(248,241,246)
18.901.11

red

#190e0d
hsl(5,31.58%,7.45%)
rgb(25,14,13)
1.1118.92
#341b1b
hsl(0,31.65%,15.49%)
rgb(52,27,27)
1.3215.93
#542626
hsl(0,37.7%,23.92%)
rgb(84,38,38)
1.6812.48
#743233
hsl(359.09,39.76%,32.55%)
rgb(116,50,51)
2.259.35
#934041
hsl(359.28,39.34%,41.37%)
rgb(147,64,65)
3.056.88
#b05152
hsl(359.37,37.55%,50.39%)
rgb(176,81,82)
4.145.07
#c86766
hsl(0.61,47.12%,59.22%)
rgb(200,103,102)
5.593.76
#da807d
hsl(1.94,55.69%,67.25%)
rgb(218,128,125)
7.362.85
#e79b98
hsl(2.28,62.2%,75.1%)
rgb(231,155,152)
9.542.20
#efb8b4
hsl(4.07,64.84%,82.16%)
rgb(239,184,180)
12.191.72
#f6d5d2
hsl(5,66.67%,89.41%)
rgb(246,213,210)
15.371.37
#fcf1f1
hsl(0,64.71%,96.67%)
rgb(252,241,241)
18.991.11

orange

#140805
hsl(12,60%,4.9%)
rgb(20,8,5)
1.0719.69
#2f1813
hsl(10.71,42.42%,12.94%)
rgb(47,24,19)
1.2616.65
#4d251b
hsl(12,48.08%,20.39%)
rgb(77,37,27)
1.6013.16
#6e3221
hsl(13.25,53.85%,28.04%)
rgb(110,50,33)
2.149.81
#8e4126
hsl(15.58,57.78%,35.29%)
rgb(142,65,38)
2.937.16
#ac512b
hsl(17.67,60%,42.16%)
rgb(172,81,43)
3.975.30
#c76232
hsl(19.33,59.84%,48.82%)
rgb(199,98,50)
5.224.02
#dd763e
hsl(21.13,70.04%,55.49%)
rgb(221,118,62)
6.743.12
#f4975f
hsl(22.55,87.13%,66.47%)
rgb(244,151,95)
9.442.22
#fdb68a
hsl(22.96,96.64%,76.67%)
rgb(253,182,138)
12.231.72
#fed5bc
hsl(22.73,97.06%,86.67%)
rgb(254,213,188)
15.461.36
#fff4ed
hsl(23.33,100%,96.47%)
rgb(255,244,237)
19.421.08

yellow

#181308
hsl(41.25,50%,6.27%)
rgb(24,19,8)
1.1418.49
#2d2411
hsl(40.71,45.16%,12.16%)
rgb(45,36,17)
1.3715.31
#433615
hsl(43.04,52.27%,17.25%)
rgb(67,54,21)
1.7811.82
#5b4919
hsl(43.64,56.9%,22.75%)
rgb(91,73,25)
2.418.71
#735c1c
hsl(44.14,60.84%,28.04%)
rgb(115,92,28)
3.286.41
#8a6f1f
hsl(44.86,63.31%,33.14%)
rgb(138,111,31)
4.374.80
#ac8c26
hsl(45.67,63.81%,41.18%)
rgb(172,140,38)
6.533.21
#d4af31
hsl(46.38,65.46%,51.18%)
rgb(212,175,49)
9.982.11
#f5cc44
hsl(46.1,89.85%,61.37%)
rgb(245,204,68)
13.601.54
#ffde70
hsl(46.15,100%,71.96%)
rgb(255,222,112)
15.931.32
#ffebb0
hsl(44.81,100%,84.51%)
rgb(255,235,176)
17.761.18
#fff9ee
hsl(38.82,100%,96.67%)
rgb(255,249,238)
20.041.05

green

#0c120a
hsl(105,28.57%,5.49%)
rgb(12,18,10)
1.1118.98
#182415
hsl(108,26.32%,11.18%)
rgb(24,36,21)
1.3016.13
#20371c
hsl(111.11,32.53%,16.27%)
rgb(32,55,28)
1.6212.93
#294a23
hsl(110.77,35.78%,21.37%)
rgb(41,74,35)
2.1010.01
#355f2d
hsl(110.4,35.71%,27.45%)
rgb(53,95,45)
2.837.43
#44743b
hsl(110.53,32.57%,34.31%)
rgb(68,116,59)
3.815.52
#59894f
hsl(109.66,26.85%,42.35%)
rgb(89,137,79)
5.124.10
#739e69
hsl(108.68,21.46%,51.57%)
rgb(115,158,105)
6.823.08
#91b487
hsl(106.67,23.08%,61.76%)
rgb(145,180,135)
9.082.31
#b0c9a8
hsl(105.45,23.4%,72.35%)
rgb(176,201,168)
11.771.78
#d0decb
hsl(104.21,22.35%,83.33%)
rgb(208,222,203)
14.991.40
#f0f4ee
hsl(100,21.43%,94.51%)
rgb(240,244,238)
18.881.11

teal

#0d1311
hsl(160,18.75%,6.27%)
rgb(13,19,17)
1.1218.78
#192420
hsl(158.18,18.03%,11.96%)
rgb(25,36,32)
1.3115.98
#223730
hsl(160,23.6%,17.45%)
rgb(34,55,48)
1.6612.67
#2b4a40
hsl(160.65,26.5%,22.94%)
rgb(43,74,64)
2.169.74
#375f52
hsl(160.5,26.67%,29.41%)
rgb(55,95,82)
2.927.19
#477365
hsl(160.91,23.66%,36.47%)
rgb(71,115,101)
3.915.37
#5c8879
hsl(159.55,19.3%,44.71%)
rgb(92,136,121)
5.254.00
#759e90
hsl(159.51,17.45%,53.92%)
rgb(117,158,144)
7.052.98
#92b3a7
hsl(158.18,17.84%,63.73%)
rgb(146,179,167)
9.232.28
#b1c8c0
hsl(159.13,17.29%,73.92%)
rgb(177,200,192)
11.891.77
#d0ded9
hsl(158.57,17.5%,84.31%)
rgb(208,222,217)
15.131.39
#f0f4f2
hsl(150,15.38%,94.9%)
rgb(240,244,242)
18.931.11

cyan

#0d1314
hsl(188.57,21.21%,6.47%)
rgb(13,19,20)
1.1218.74
#162527
hsl(187.06,27.87%,11.96%)
rgb(22,37,39)
1.3315.81
#1d383c
hsl(187.74,34.83%,17.45%)
rgb(29,56,60)
1.6812.48
#234c51
hsl(186.52,39.66%,22.75%)
rgb(35,76,81)
2.229.44
#2d6067
hsl(187.24,39.19%,29.02%)
rgb(45,96,103)
2.987.05
#3c757d
hsl(187.38,35.14%,36.27%)
rgb(60,117,125)
4.035.21
#528a92
hsl(187.5,28.07%,44.71%)
rgb(82,138,146)
5.413.88
#6e9fa7
hsl(188.42,24.46%,54.31%)
rgb(110,159,167)
7.182.92
#8cb4ba
hsl(187.83,25%,63.92%)
rgb(140,180,186)
9.352.25
#adc9cd
hsl(187.5,24.24%,74.12%)
rgb(173,201,205)
12.011.75
#cfdfe1
hsl(186.67,23.08%,84.71%)
rgb(207,223,225)
15.301.37
#eff4f5
hsl(190,23.08%,94.9%)
rgb(239,244,245)
18.931.11

Color modes

Text color Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
PrimaryPrimarySome muted text as an example
Text color Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
PrimaryPrimarySome muted text as an example
Text color Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
PrimaryPrimarySome muted text as an example
Text color Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
PrimaryPrimarySome muted text as an example
Text color Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
PrimaryPrimarySome muted text as an example
Text color Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
PrimaryPrimarySome muted text as an example
Text color Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
PrimaryPrimarySome muted text as an example
Text color Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
PrimaryPrimarySome muted text as an example
Text color Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
PrimaryPrimarySome muted text as an example
Text color Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
PrimaryPrimarySome muted text as an example
Text color Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
PrimaryPrimarySome muted text as an example
Text color Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
PrimaryPrimarySome muted text as an example
Log inSign up
Color groups

Color modes

Gradients
Font Sizes

Font Families

Line Heights

Letter Spacing

Text Styles
Space
Border Radius

Border Widths

Border Styles
Box Shadows

Text Shadows
Media queries

Min-width based media queries for setting responsive styles. These values are used when generating responsive css styles as well as within theme definitions.

0
Global - All screen sizes

6258 accessible combinations




New theme

Start with a template
Color systems
Themes