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
#f2f2f0
copy
#ff5e3a
copy
#2c365d
copy
#272e4f
copy
CSS Code
Go fullscreen
#33425b
copy
#3498db
copy
#fcc29a
copy
#ecf0f1
copy
CSS Code
Go fullscreen
#f7b449
copy
#dde9f8
copy
#8293e3
copy
#5847ad
copy
CSS Code
Go fullscreen
#ececec
copy
#9fd3c7
copy
#385170
copy
#142d4c
copy
CSS Code
Go fullscreen
#abedd8
copy
#46cdcf
copy
#0081c6
copy
#48466d
copy
CSS Code
Go fullscreen
#1333a6
copy
#317ae1
copy
#1fdedb
copy
#fffcbf
copy
CSS Code
Go fullscreen
#d4ed9d
copy
#64a97b
copy
#3a5465
copy
#3d3931
copy
CSS Code
Go fullscreen
#ecfeff
copy
#00b7c2
copy
#128494
copy
#4ef037
copy
CSS Code
Go fullscreen
#feffdf
copy
#dde0ab
copy
#97cba9
copy
#668ba4
copy
CSS Code
Go fullscreen
#f76262
copy
#216583
copy
#65c0ba
copy
#cffdf8
copy
CSS Code
Go fullscreen
#343434
copy
#2d4059
copy
#ea5455
copy
#fde9c9
copy
CSS Code
Go fullscreen
#eeeeee
copy
#fcc314
copy
#94ac3c
copy
#295ba7
copy
CSS Code
Go fullscreen
#5f2f14
copy
#1297bd
copy
#1ad7db
copy
#f3f1f1
copy
CSS Code
Go fullscreen
#feed30
copy
#ff6868
copy
#924992
copy
#504077
copy
CSS Code
Go fullscreen
#d2f6fc
copy
#a9d2ff
copy
#7984ee
copy
#6730ec
copy
CSS Code
Go fullscreen
#449187
copy
#91e4a6
copy
#5f64c0
copy
#453064
copy
CSS Code
Go fullscreen
#f8ff95
copy
#7be77e
copy
#7a8cf0
copy
#a45fe6
copy
CSS Code
Go fullscreen
#f4f787
copy
#85eb4e
copy
#32c38c
copy
#3f84ac
copy
CSS Code
Go fullscreen
#f7f5b2
copy
#bad4f9
copy
#5e89ef
copy
#352771
copy
CSS Code
Go fullscreen
#020438
copy
#284184
copy
#1f8ea3
copy
#00eaff
copy
CSS Code
Go fullscreen
#e4f1fe
copy
#8dc6ff
copy
#22313f
copy
#34495e
copy
CSS Code
Go fullscreen
#f4f56e
copy
#72e8e1
copy
#58b3d3
copy
#418c9f
copy
CSS Code
Go fullscreen
#7acfdf
copy
#f47645
copy
#f9ad8d
copy
#fde3d9
copy
CSS Code
Go fullscreen
#fff9c1
copy
#ffa1d0
copy
#c244fb
copy
#84e9ff
copy
CSS Code
Go fullscreen
#bef2eb
copy
#6dc995
copy
#3a91aa
copy
#6b4897
copy
CSS Code
Go fullscreen
#397298
copy
#8ac4ff
copy
#9179ef
copy
#7b417d
copy
CSS Code
Go fullscreen
#970747
copy
#fef4e8
copy
#13445a
copy
#446878
copy
CSS Code
Go fullscreen
#118df0
copy
#0e2f56
copy
#ff304f
copy
#ececda
copy
CSS Code
Go fullscreen
#231a31
copy
#e42f45
copy
#b42b3f
copy
#8ab2ff
copy
CSS Code
Go fullscreen
#a9eee6
copy
#fefaec
copy
#f38181
copy
#625772
copy
CSS Code
Go fullscreen
#ffd5e5
copy
#ffffdd
copy
#a0ffe6
copy
#81f5ff
copy
CSS Code
Go fullscreen
#ffcece
copy
#ffc1c8
copy
#ffe3b0
copy
#8ed6ff
copy
CSS Code
Go fullscreen
#b590ca
copy
#a8d3da
copy
#f5cab3
copy
#f3ecb8
copy
CSS Code
Go fullscreen
#a3f3eb
copy
#f1ffab
copy
#fbd341
copy
#fb9a40
copy
CSS Code
Go fullscreen
#fdf196
copy
#c5fcda
copy
#98e5ec
copy
#67bac6
copy
CSS Code
Go fullscreen
#ffe6eb
copy
#defcfc
copy
#cbf1f5
copy
#a6e3e9
copy
CSS Code
Go fullscreen
#e1f5f2
copy
#6bc5d2
copy
#5a5d9d
copy
#390050
copy
CSS Code
Go fullscreen
#b2b7ff
copy
#d5e8ff
copy
#d9a2f1
copy
#d86f9b
copy
CSS Code
Go fullscreen
#fffeec
copy
#aeddcd
copy
#e4508f
copy
#556fb5
copy
CSS Code
Go fullscreen
#4d12ee
copy
#2f24c1
copy
#3fd1cb
copy
#f8f6f6
copy
CSS Code
Go fullscreen
#fafafa
copy
#e8f1f5
copy
#005691
copy
#004a7c
copy
CSS Code
Go fullscreen
#2e94b9
copy
#475053
copy
#acdcee
copy
#f0fbff
copy
CSS Code
Go fullscreen
#ffe495
copy
#ffc97b
copy
#44558f
copy
#e6f7f7
copy
CSS Code
Go fullscreen
#d1ffa2
copy
#00cf95
copy
#0098ef
copy
#6d0ad3
copy
CSS Code
Go fullscreen
#48466d
copy
#3d84a8
copy
#46cdcf
copy
#abedd8
copy
CSS Code
Go fullscreen
#ece493
copy
#84a1be
copy
#5c7893
copy
#535962
copy
CSS Code
Go fullscreen
#0278ae
copy
#51dacf
copy
#9ef5cf
copy
#e8ffc1
copy
CSS Code
Go fullscreen
#9ddcdc
copy
#fff4e1
copy
#ffebb7
copy
#e67a7a
copy
CSS Code
Go fullscreen
#f3d1f4
copy
#f5fcc1
copy
#bae5e5
copy
#98d6ea
copy
CSS Code
Go fullscreen
#80c0ce
copy
#467292
copy
#9adea2
copy
#c2f69b
copy
CSS Code
Go fullscreen
#ffdede
copy
#f7f3ce
copy
#c5ecbe
copy
#4797b1
copy
CSS Code
Go fullscreen
#5639a6
copy
#20236d
copy
#fa4848
copy
#ffe087
copy
CSS Code
Go fullscreen
#071e3d
copy
#1f4287
copy
#278ea5
copy
#21e6c1
copy
CSS Code
Go fullscreen
#f6f078
copy
#01d28e
copy
#434982
copy
#730068
copy
CSS Code
Go fullscreen
#ffa3ac
copy
#00043c
copy
#005d6c
copy
#00c9b1
copy
CSS Code
Go fullscreen
#f4f4ec
copy
#76e2f4
copy
#615dec
copy
#301781
copy
CSS Code
Go fullscreen
#225763
copy
#41d8bf
copy
#2f89b3
copy
#3b50b2
copy
CSS Code
Go fullscreen
#272932
copy
#1c7293
copy
#b9e3c6
copy
#f1f2eb
copy
CSS Code
Go fullscreen
#ffdfdf
copy
#fbc1bc
copy
#315b96
copy
#233567
copy
CSS Code
Go fullscreen
#10316b
copy
#0b8457
copy
#eac100
copy
#dee1ec
copy
CSS Code
Go fullscreen
#062743
copy
#113a5d
copy
#c4ffdd
copy
#f9f9f9
copy
CSS Code
Go fullscreen
#36626a
copy
#588d9c
copy
#73b1c1
copy
#f1d18a
copy
CSS Code
Go fullscreen
#e8e8e8
copy
#5588a3
copy
#145374
copy
#00334e
copy
CSS Code
Go fullscreen
#2c2955
copy
#4c5fb1
copy
#f9f194
copy
#cdd582
copy
CSS Code
Go fullscreen
#fafaf6
copy
#00fff0
copy
#00d1ff
copy
#3d6cb9
copy
CSS Code
Go fullscreen
#69779b
copy
#9692af
copy
#acdbdf
copy
#d7eaea
copy
CSS Code
Go fullscreen
#e8ecf1
copy
#b5cfd8
copy
#7393a7
copy
#6c737e
copy
CSS Code
Go fullscreen
#f4f7ed
copy
#86ee60
copy
#2e6e65
copy
#2b3752
copy
CSS Code
Go fullscreen
#2b4450
copy
#497285
copy
#dfebed
copy
#f78536
copy
CSS Code
Go fullscreen
#cefff1
copy
#ace7ef
copy
#a6acec
copy
#a56cc1
copy
CSS Code
Go fullscreen
#f23557
copy
#f0d43a
copy
#22b2da
copy
#3b4a6b
copy
CSS Code
Go fullscreen
#ffcbcb
copy
#ffb5b5
copy
#407088
copy
#132743
copy
CSS Code
Go fullscreen
#0e0220
copy
#e40475
copy
#48e0e4
copy
#d7fbf6
copy
CSS Code
Go fullscreen
#6b62ce
copy
#372e96
copy
#2f99ad
copy
#84efe2
copy
CSS Code
Go fullscreen
#f2f1a7
copy
#ef5959
copy
#b43144
copy
#88a9f7
copy
CSS Code
Go fullscreen
#302387
copy
#ff3796
copy
#00faac
copy
#fffdaf
copy
CSS Code
Go fullscreen
#ffdd83
copy
#e3f8ff
copy
#31bccc
copy
#405983
copy
CSS Code
Go fullscreen
#f6efb4
copy
#35c2bd
copy
#2796cb
copy
#3379e4
copy
CSS Code
Go fullscreen
#2794eb
copy
#bff8d4
copy
#47d6b6
copy
#17b3c1
copy
CSS Code
Go fullscreen
#352d4d
copy
#6d6192
copy
#69b0c1
copy
#92e0a9
copy
CSS Code
Go fullscreen
#f47c7c
copy
#f7f48b
copy
#a1de93
copy
#70a1d7
copy
CSS Code
Go fullscreen
#bc5148
copy
#fef8e6
copy
#7bcecc
copy
#3090a1
copy
CSS Code
Go fullscreen
#f1ffd9
copy
#8bdbf5
copy
#b292ea
copy
#eb55bf
copy
CSS Code
Go fullscreen
#151680
copy
#1c44ac
copy
#375fc0
copy
#f1fea4
copy
CSS Code
Go fullscreen
#11cbd7
copy
#9feed1
copy
#fff6a2
copy
#f60c86
copy
CSS Code
Go fullscreen
#4cb3cd
copy
#52d6d3
copy
#5968b1
copy
#302579
copy
CSS Code
Go fullscreen
#f8b195
copy
#f67280
copy
#c06c84
copy
#355c7d
copy
CSS Code
Go fullscreen
#76d3ff
copy
#d78bff
copy
#fffa9d
copy
#ffbd74
copy
CSS Code
Go fullscreen
#00334e
copy
#145374
copy
#5588a3
copy
#e8e8e8
copy
CSS Code
Go fullscreen
#eeeeee
copy
#cde8f6
copy
#d195f9
copy
#0033c7
copy
CSS Code
Go fullscreen
#29d2e4
copy
#13829b
copy
#fcc29a
copy
#fde9c9
copy
CSS Code
Go fullscreen
#f2fcfc
copy
#bdf1f6
copy
#8fbaf3
copy
#0245a3
copy
CSS Code
Go fullscreen
#ffb400
copy
#fffbe0
copy
#2994b2
copy
#474744
copy
CSS Code
Go fullscreen
#a561ff
copy
#fd72ad
copy
#fcce9e
copy
#cfe3ff
copy
CSS Code
Go fullscreen
#bad7df
copy
#ffe2e2
copy
#f6f6f6
copy
#99ddcc
copy
CSS Code
Go fullscreen
#233142
copy
#455d7a
copy
#f95959
copy
#facf5a
copy
CSS Code
Go fullscreen
#1b3c59
copy
#456173
copy
#a6ed8e
copy
#f2f2f0
copy
CSS Code
Go fullscreen
#ff895d
copy
#d5eeff
copy
#78bbe6
copy
#1b435d
copy
CSS Code
Go fullscreen
#2e94b9
copy
#fffdc1
copy
#f0b775
copy
#d25565
copy
CSS Code
Go fullscreen
#b9f9ff
copy
#dafdff
copy
#f7e590
copy
#f5cd6d
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
175,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.