Coding Workshops
SheCodes Basics
3-week coding workshop
SheCodes Plus
3-month coding workshop
SheCodes Pro
6-month coding workshop
SheCodes Max
8-month coding workshop
SheCodes FREE Class
60-minute coding class for beginners
SheCodes Quick Links
SheCodes Workshops
Coding workshops for women
SheCodes Foundation
For women in developing countries and refugees
SheCodes Tools
Free coding tools for developers
SheCodes Connect
Connect with SheCodes Alumni
SheCodes Radio
Curated tracks to help you keep on track, 24/7
SheCodes Challenges
Coding challenges for the SheCodes Community
SheCodes Athena
Your AI Coding Assistant
CSS Generators
CSS Gradients
CSS Color Palettes
Front-end Cheatsheets
Learn to Code
CSS Color Palette
Copy to clipboard
Feel free to customize the CSS class names
Back to all palettes
More Blue CSS Color Palettes
#d9dad7
copy
#c24d2c
copy
#3e4a61
copy
#1a2639
copy
CSS Code
Go fullscreen
#08085e
copy
#a2ef44
copy
#fff07a
copy
#e8fcf6
copy
CSS Code
Go fullscreen
#d0f66a
copy
#36c186
copy
#158a8c
copy
#1e5287
copy
CSS Code
Go fullscreen
#1333a6
copy
#317ae1
copy
#1fdedb
copy
#fffcbf
copy
CSS Code
Go fullscreen
#f8b195
copy
#f67280
copy
#c06c84
copy
#355c7d
copy
CSS Code
Go fullscreen
#083c5a
copy
#4cb648
copy
#fcc72c
copy
#e4f4fd
copy
CSS Code
Go fullscreen
#f4f4ec
copy
#76e2f4
copy
#615dec
copy
#301781
copy
CSS Code
Go fullscreen
#211572
copy
#48c0d3
copy
#dedede
copy
#ffe578
copy
CSS Code
Go fullscreen
#414a50
copy
#85a6b1
copy
#8bd7d1
copy
#caedde
copy
CSS Code
Go fullscreen
#00649f
copy
#01aac1
copy
#00dbe7
copy
#97ecc5
copy
CSS Code
Go fullscreen
#23374d
copy
#1089ff
copy
#e5e5e5
copy
#eeeeee
copy
CSS Code
Go fullscreen
#f5f5f5
copy
#01ecd5
copy
#4586ff
copy
#32424a
copy
CSS Code
Go fullscreen
#83e4b5
copy
#3ec8ac
copy
#4e90a4
copy
#6e60a0
copy
CSS Code
Go fullscreen
#e0fcff
copy
#bde4f4
copy
#404969
copy
#ff7f50
copy
CSS Code
Go fullscreen
#3c415e
copy
#738598
copy
#dfe2e2
copy
#1cb3c8
copy
CSS Code
Go fullscreen
#f0f08e
copy
#91ca62
copy
#478077
copy
#3a4874
copy
CSS Code
Go fullscreen
#ffd5e5
copy
#ffffdd
copy
#a0ffe6
copy
#81f5ff
copy
CSS Code
Go fullscreen
#ffedc6
copy
#cdeeaa
copy
#96dae4
copy
#6d70c6
copy
CSS Code
Go fullscreen
#233142
copy
#455d7a
copy
#f95959
copy
#e3e3e3
copy
CSS Code
Go fullscreen
#e7eaf6
copy
#a2a8d3
copy
#38598b
copy
#113f67
copy
CSS Code
Go fullscreen
#5639a6
copy
#20236d
copy
#fa4848
copy
#ffe087
copy
CSS Code
Go fullscreen
#1c0c2a
copy
#343b99
copy
#61bdf6
copy
#9affdc
copy
CSS Code
Go fullscreen
#b7b9f4
copy
#5254d8
copy
#192294
copy
#000278
copy
CSS Code
Go fullscreen
#111f4d
copy
#f2f4f7
copy
#e43a19
copy
#020205
copy
CSS Code
Go fullscreen
#90aeff
copy
#cefc86
copy
#60efb8
copy
#f9f7f7
copy
CSS Code
Go fullscreen
#f9c4ac
copy
#626f92
copy
#474168
copy
#272637
copy
CSS Code
Go fullscreen
#48f3db
copy
#51c4e9
copy
#6150c1
copy
#4a3764
copy
CSS Code
Go fullscreen
#118df0
copy
#0e2f56
copy
#ff304f
copy
#ececda
copy
CSS Code
Go fullscreen
#ffcbcb
copy
#ffb5b5
copy
#407088
copy
#132743
copy
CSS Code
Go fullscreen
#fcf9ea
copy
#badfdb
copy
#49beb7
copy
#ff8a5c
copy
CSS Code
Go fullscreen
#f3ff92
copy
#f6ce59
copy
#2e8fc6
copy
#56cfd2
copy
CSS Code
Go fullscreen
#6f4f8b
copy
#6d739d
copy
#7dbcc8
copy
#b9eaf5
copy
CSS Code
Go fullscreen
#146c78
copy
#0e91a1
copy
#7dce94
copy
#efede7
copy
CSS Code
Go fullscreen
#f46188
copy
#491d7f
copy
#642ab6
copy
#7779ff
copy
CSS Code
Go fullscreen
#1a2634
copy
#203e5f
copy
#ffcc00
copy
#fee5b1
copy
CSS Code
Go fullscreen
#01005e
copy
#22267b
copy
#28518a
copy
#17b794
copy
CSS Code
Go fullscreen
#f2f7ff
copy
#0b409c
copy
#10316b
copy
#fdbe34
copy
CSS Code
Go fullscreen
#b8f7d4
copy
#6fe7db
copy
#7fa6ee
copy
#835af1
copy
CSS Code
Go fullscreen
#d1ffa2
copy
#00cf95
copy
#0098ef
copy
#6d0ad3
copy
CSS Code
Go fullscreen
#f9fd50
copy
#85ef47
copy
#00bd56
copy
#207dff
copy
CSS Code
Go fullscreen
#f96d6d
copy
#b84d69
copy
#a9d7f6
copy
#8fb1e9
copy
CSS Code
Go fullscreen
#ff895d
copy
#d5eeff
copy
#78bbe6
copy
#1b435d
copy
CSS Code
Go fullscreen
#293462
copy
#211a4c
copy
#f33535
copy
#a51c2d
copy
CSS Code
Go fullscreen
#fe7187
copy
#ca4b7c
copy
#7a2e7a
copy
#a8d7f7
copy
CSS Code
Go fullscreen
#f3d1f4
copy
#f5fcc1
copy
#bae5e5
copy
#98d6ea
copy
CSS Code
Go fullscreen
#071a52
copy
#086972
copy
#17b978
copy
#a7ff83
copy
CSS Code
Go fullscreen
#bc5148
copy
#fef8e6
copy
#7bcecc
copy
#3090a1
copy
CSS Code
Go fullscreen
#f4eeff
copy
#dcd6f7
copy
#a6b1e1
copy
#424874
copy
CSS Code
Go fullscreen
#364f6b
copy
#3fc1c9
copy
#fce38a
copy
#fc5185
copy
CSS Code
Go fullscreen
#f9f8eb
copy
#ffe1b6
copy
#7a9eb1
copy
#415865
copy
CSS Code
Go fullscreen
#faee5a
copy
#e4fcf9
copy
#ace6f6
copy
#4b89ac
copy
CSS Code
Go fullscreen
#2e94b9
copy
#fffdc1
copy
#f0b775
copy
#fd5959
copy
CSS Code
Go fullscreen
#ff5ab0
copy
#f7fed4
copy
#4df4ff
copy
#1bb5ec
copy
CSS Code
Go fullscreen
#f06868
copy
#fab57a
copy
#edf798
copy
#80d6ff
copy
CSS Code
Go fullscreen
#edf7fa
copy
#5f6caf
copy
#ffb677
copy
#ff8364
copy
CSS Code
Go fullscreen
#07689f
copy
#a2d5f2
copy
#fafafa
copy
#ff7e67
copy
CSS Code
Go fullscreen
#d7df71
copy
#0e5f76
copy
#083d56
copy
#081e3f
copy
CSS Code
Go fullscreen
#323643
copy
#606470
copy
#93deff
copy
#f7f7f7
copy
CSS Code
Go fullscreen
#d4ffa3
copy
#00d8b1
copy
#1f9ec7
copy
#3f7a9c
copy
CSS Code
Go fullscreen
#f7b449
copy
#dde9f8
copy
#8293e3
copy
#5847ad
copy
CSS Code
Go fullscreen
#734488
copy
#492645
copy
#9febeb
copy
#fafcdb
copy
CSS Code
Go fullscreen
#51eaea
copy
#fffde1
copy
#ff9d76
copy
#fb3569
copy
CSS Code
Go fullscreen
#005689
copy
#007cb9
copy
#f6c667
copy
#f1f8fd
copy
CSS Code
Go fullscreen
#247291
copy
#f8da5b
copy
#eef2e2
copy
#f5f9ee
copy
CSS Code
Go fullscreen
#6fe7dd
copy
#3490de
copy
#6639a6
copy
#521262
copy
CSS Code
Go fullscreen
#c7f5fe
copy
#fcc8f8
copy
#eab4f8
copy
#f3f798
copy
CSS Code
Go fullscreen
#d7fffd
copy
#a1e6e3
copy
#eca0b6
copy
#fafba4
copy
CSS Code
Go fullscreen
#272343
copy
#ffffff
copy
#e3f6f5
copy
#bae8e8
copy
CSS Code
Go fullscreen
#071e3d
copy
#1f4287
copy
#278ea5
copy
#21e6c1
copy
CSS Code
Go fullscreen
#fd5f00
copy
#00204a
copy
#005792
copy
#d9faff
copy
CSS Code
Go fullscreen
#b1e9a3
copy
#7ac38f
copy
#88e0d0
copy
#c7eeff
copy
CSS Code
Go fullscreen
#c8f0f0
copy
#86d8dc
copy
#7047a3
copy
#3a276a
copy
CSS Code
Go fullscreen
#f78536
copy
#dfebed
copy
#497285
copy
#2b4450
copy
CSS Code
Go fullscreen
#2e94b9
copy
#475053
copy
#acdcee
copy
#f0fbff
copy
CSS Code
Go fullscreen
#0c2233
copy
#065471
copy
#0a91ab
copy
#ffc045
copy
CSS Code
Go fullscreen
#353b6e
copy
#252243
copy
#74deed
copy
#9365db
copy
CSS Code
Go fullscreen
#98d8ff
copy
#796dce
copy
#694b7c
copy
#402a30
copy
CSS Code
Go fullscreen
#f3f169
copy
#46c3db
copy
#2d6cdf
copy
#482ff7
copy
CSS Code
Go fullscreen
#e9e6c9
copy
#ca6144
copy
#566683
copy
#393e51
copy
CSS Code
Go fullscreen
#eaf887
copy
#79dc96
copy
#3bbbb3
copy
#377aaf
copy
CSS Code
Go fullscreen
#ece493
copy
#84a1be
copy
#5c7893
copy
#535962
copy
CSS Code
Go fullscreen
#ecfeff
copy
#00b7c2
copy
#128494
copy
#4ef037
copy
CSS Code
Go fullscreen
#dddddd
copy
#516c8d
copy
#28385e
copy
#304163
copy
CSS Code
Go fullscreen
#ffabe5
copy
#c7f5ff
copy
#d89fff
copy
#f6fcae
copy
CSS Code
Go fullscreen
#19215e
copy
#f7e6b5
copy
#fa67ab
copy
#80185f
copy
CSS Code
Go fullscreen
#f7f7f7
copy
#fcd59b
copy
#1fa8cf
copy
#2657c1
copy
CSS Code
Go fullscreen
#bef2eb
copy
#6dc995
copy
#3a91aa
copy
#6b4897
copy
CSS Code
Go fullscreen
#364f6b
copy
#3fc1c9
copy
#f5f5f5
copy
#fc5185
copy
CSS Code
Go fullscreen
#06cdff
copy
#8200ff
copy
#470c85
copy
#18134c
copy
CSS Code
Go fullscreen
#f38181
copy
#fce38a
copy
#eaffd0
copy
#95e1d3
copy
CSS Code
Go fullscreen
#f38181
copy
#fce38a
copy
#d6f7ad
copy
#95e1d3
copy
CSS Code
Go fullscreen
#ffdd83
copy
#e3f8ff
copy
#31bccc
copy
#405983
copy
CSS Code
Go fullscreen
#b0e6ff
copy
#7687db
copy
#8f45a9
copy
#582e48
copy
CSS Code
Go fullscreen
#0278ae
copy
#51adcf
copy
#a5ecd7
copy
#e8ffc1
copy
CSS Code
Go fullscreen
#80c0ce
copy
#467292
copy
#9adea2
copy
#c2f69b
copy
CSS Code
Go fullscreen
#e6f8f9
copy
#b1e8ed
copy
#edb5f5
copy
#e86ed0
copy
CSS Code
Go fullscreen
#7a81eb
copy
#504aa7
copy
#253361
copy
#599597
copy
CSS Code
Go fullscreen
#2a3356
copy
#f35b25
copy
#fdfcfc
copy
#e8e2e2
copy
CSS Code
Go fullscreen
#005689
copy
#007cb9
copy
#d5eeff
copy
#ff895d
copy
CSS Code
Go fullscreen
#ececeb
copy
#f9a828
copy
#07617d
copy
#2e383f
copy
CSS Code
Go fullscreen
All Blue CSS Color Palettes
👩💻
What is SheCodes?
SheCodes teaches coding skills to busy women
Start your dream career in tech
Learn more about SheCodes
4.9/5
, our workshops are highly recommended by
180,000+ women, including employees from these companies
📬
Join Our Mailing List
Be the first to know about upcoming coding workshops, new coding tools, and other SheCodes related news.