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
#fdf196
copy
#c5fcda
copy
#98e5ec
copy
#67bac6
copy
CSS Code
Go fullscreen
#ff8fe5
copy
#fbff64
copy
#76e3ff
copy
#7bc7fa
copy
CSS Code
Go fullscreen
#feffdf
copy
#dde0ab
copy
#97cba9
copy
#668ba4
copy
CSS Code
Go fullscreen
#183661
copy
#1c4b82
copy
#dd6b4d
copy
#dae1e7
copy
CSS Code
Go fullscreen
#0e0220
copy
#e40475
copy
#48e0e4
copy
#d7fbf6
copy
CSS Code
Go fullscreen
#d0f66a
copy
#36c186
copy
#158a8c
copy
#1e5287
copy
CSS Code
Go fullscreen
#f4f56e
copy
#72e8e1
copy
#58b3d3
copy
#418c9f
copy
CSS Code
Go fullscreen
#6a759b
copy
#21273d
copy
#b9d4f1
copy
#f1f6f8
copy
CSS Code
Go fullscreen
#8be3e1
copy
#d3f7ad
copy
#95bb76
copy
#97935c
copy
CSS Code
Go fullscreen
#ffdd93
copy
#58dada
copy
#1ca2bb
copy
#005e7c
copy
CSS Code
Go fullscreen
#f5f7fa
copy
#5be7c4
copy
#4fc1e9
copy
#7a57d1
copy
CSS Code
Go fullscreen
#f76262
copy
#216583
copy
#65c0ba
copy
#cffdf8
copy
CSS Code
Go fullscreen
#f38181
copy
#fce38a
copy
#eaffd0
copy
#95e1d3
copy
CSS Code
Go fullscreen
#106ee8
copy
#0fc1a1
copy
#90e0ab
copy
#cbffce
copy
CSS Code
Go fullscreen
#fafcd6
copy
#259f6c
copy
#1e6b7f
copy
#140303
copy
CSS Code
Go fullscreen
#51eaea
copy
#fffde1
copy
#ff9d76
copy
#fb3569
copy
CSS Code
Go fullscreen
#0c056d
copy
#590d82
copy
#b61aae
copy
#f25d9c
copy
CSS Code
Go fullscreen
#015668
copy
#06648c
copy
#0f81c7
copy
#0de2ea
copy
CSS Code
Go fullscreen
#2aaf74
copy
#4ed99c
copy
#d1ebfe
copy
#f7be7f
copy
CSS Code
Go fullscreen
#422b72
copy
#266d98
copy
#3cb29a
copy
#c4f080
copy
CSS Code
Go fullscreen
#f6f6f6
copy
#d6e4f0
copy
#1e56a0
copy
#163172
copy
CSS Code
Go fullscreen
#f3f6f6
copy
#90eee1
copy
#55b3f3
copy
#6356e5
copy
CSS Code
Go fullscreen
#e9f679
copy
#9bdf46
copy
#25a55f
copy
#346473
copy
CSS Code
Go fullscreen
#f35f5f
copy
#cc435f
copy
#f1ea65
copy
#36a3eb
copy
CSS Code
Go fullscreen
#d5441c
copy
#013c4d
copy
#9dd5cb
copy
#f3e5b1
copy
CSS Code
Go fullscreen
#005689
copy
#007cb9
copy
#f6c667
copy
#f1f8fd
copy
CSS Code
Go fullscreen
#defcf9
copy
#cadefc
copy
#c3bef0
copy
#cca8e9
copy
CSS Code
Go fullscreen
#4e4e6a
copy
#1f6cb0
copy
#70a3c4
copy
#e7e8f5
copy
CSS Code
Go fullscreen
#f39de5
copy
#9b77da
copy
#4e6b9f
copy
#6fa5b1
copy
CSS Code
Go fullscreen
#eef2f5
copy
#ea168e
copy
#612570
copy
#1eafed
copy
CSS Code
Go fullscreen
#e3e8f8
copy
#c0c5cd
copy
#3e588f
copy
#203562
copy
CSS Code
Go fullscreen
#83cbfb
copy
#377fd9
copy
#edf68d
copy
#f1d851
copy
CSS Code
Go fullscreen
#bff4ed
copy
#280f34
copy
#e41655
copy
#b30753
copy
CSS Code
Go fullscreen
#e9fadd
copy
#b8e4c9
copy
#3f5468
copy
#42291c
copy
CSS Code
Go fullscreen
#96c99c
copy
#55829c
copy
#485791
copy
#3a316e
copy
CSS Code
Go fullscreen
#414a50
copy
#85a6b1
copy
#8bd7d1
copy
#caedde
copy
CSS Code
Go fullscreen
#e4f5e5
copy
#a6dfde
copy
#88a6e5
copy
#8d6ec8
copy
CSS Code
Go fullscreen
#d2fafb
copy
#5acfd6
copy
#189bfa
copy
#0c4b8e
copy
CSS Code
Go fullscreen
#31588a
copy
#638ccc
copy
#90b2e4
copy
#eacf79
copy
CSS Code
Go fullscreen
#f46188
copy
#491d7f
copy
#642ab6
copy
#7779ff
copy
CSS Code
Go fullscreen
#2a3356
copy
#f35b25
copy
#fdfcfc
copy
#e8e2e2
copy
CSS Code
Go fullscreen
#d7df71
copy
#0e5f76
copy
#083d56
copy
#081e3f
copy
CSS Code
Go fullscreen
#272e6e
copy
#ffffc3
copy
#ffc55c
copy
#e95d35
copy
CSS Code
Go fullscreen
#d2f6fc
copy
#a9d2ff
copy
#7984ee
copy
#6730ec
copy
CSS Code
Go fullscreen
#21243d
copy
#ff7c7c
copy
#ffd082
copy
#88e1f2
copy
CSS Code
Go fullscreen
#f1fcfd
copy
#c7eeff
copy
#4d6de3
copy
#393737
copy
CSS Code
Go fullscreen
#00204a
copy
#005792
copy
#00bbf0
copy
#fdb44b
copy
CSS Code
Go fullscreen
#3a1f5d
copy
#c83660
copy
#e15249
copy
#f6d365
copy
CSS Code
Go fullscreen
#dbf1f2
copy
#cd5555
copy
#882042
copy
#efedbb
copy
CSS Code
Go fullscreen
#bff4ed
copy
#280f34
copy
#b30753
copy
#f6c667
copy
CSS Code
Go fullscreen
#2f3c4f
copy
#506f86
copy
#fbb040
copy
#de703c
copy
CSS Code
Go fullscreen
#0e3150
copy
#6dc9c8
copy
#ffc0c2
copy
#f7e9e3
copy
CSS Code
Go fullscreen
#006c9a
copy
#00bebe
copy
#00f3e4
copy
#9ff9c1
copy
CSS Code
Go fullscreen
#616eef
copy
#09a8fa
copy
#41c5d3
copy
#d0f1cf
copy
CSS Code
Go fullscreen
#f4f4ec
copy
#76e2f4
copy
#615dec
copy
#301781
copy
CSS Code
Go fullscreen
#f5feff
copy
#bde4f4
copy
#404969
copy
#dc552c
copy
CSS Code
Go fullscreen
#fcefed
copy
#6173f4
copy
#3b2e40
copy
#f35e3e
copy
CSS Code
Go fullscreen
#f7f4ea
copy
#9ce3cf
copy
#6a7ff5
copy
#574b9b
copy
CSS Code
Go fullscreen
#152a38
copy
#29435c
copy
#556e53
copy
#d1d4c9
copy
CSS Code
Go fullscreen
#fff9c1
copy
#ffa1d0
copy
#c244fb
copy
#84e9ff
copy
CSS Code
Go fullscreen
#062c80
copy
#0e6ac7
copy
#4fb9fc
copy
#f6f5da
copy
CSS Code
Go fullscreen
#591fce
copy
#0c9cee
copy
#3dbdc2
copy
#a1f480
copy
CSS Code
Go fullscreen
#eff0f4
copy
#d3d6db
copy
#415f9d
copy
#233b6e
copy
CSS Code
Go fullscreen
#d1ffa2
copy
#00cf95
copy
#0098ef
copy
#6d0ad3
copy
CSS Code
Go fullscreen
#f67280
copy
#c06c84
copy
#6c5b7b
copy
#35477d
copy
CSS Code
Go fullscreen
#233142
copy
#36506c
copy
#a5def1
copy
#ebf7fd
copy
CSS Code
Go fullscreen
#fafafa
copy
#c7eeff
copy
#0077c0
copy
#1d242b
copy
CSS Code
Go fullscreen
#2f3c4f
copy
#506e86
copy
#fcb040
copy
#de703b
copy
CSS Code
Go fullscreen
#ffffe3
copy
#87e0ff
copy
#53c7f0
copy
#1d97c1
copy
CSS Code
Go fullscreen
#083c5a
copy
#4cb648
copy
#fcc72c
copy
#e4f4fd
copy
CSS Code
Go fullscreen
#4531b1
copy
#a836ad
copy
#f16896
copy
#fff0a4
copy
CSS Code
Go fullscreen
#022c43
copy
#053f5e
copy
#115173
copy
#ffd700
copy
CSS Code
Go fullscreen
#0278ae
copy
#51dacf
copy
#9ef5cf
copy
#e8ffb1
copy
CSS Code
Go fullscreen
#39627f
copy
#4b788f
copy
#e4de66
copy
#beb000
copy
CSS Code
Go fullscreen
#1684a7
copy
#09a599
copy
#f6ec72
copy
#f6f6f6
copy
CSS Code
Go fullscreen
#e7e6e1
copy
#f7f6e7
copy
#c1c0b9
copy
#537791
copy
CSS Code
Go fullscreen
#f96d6d
copy
#b84d69
copy
#a9d7f6
copy
#8fb1e9
copy
CSS Code
Go fullscreen
#b7fbff
copy
#fff6be
copy
#ffe0a3
copy
#ffa1ac
copy
CSS Code
Go fullscreen
#f9f7f7
copy
#dbe2ef
copy
#3f72af
copy
#112d4e
copy
CSS Code
Go fullscreen
#ee8572
copy
#35495e
copy
#347474
copy
#63b7af
copy
CSS Code
Go fullscreen
#c1224f
copy
#f16f6f
copy
#94d2e6
copy
#fff78f
copy
CSS Code
Go fullscreen
#f6eb9a
copy
#5853bc
copy
#362391
copy
#1c0c59
copy
CSS Code
Go fullscreen
#f9c4ac
copy
#626f92
copy
#474168
copy
#272637
copy
CSS Code
Go fullscreen
#005689
copy
#007cb9
copy
#d5eeff
copy
#ff895d
copy
CSS Code
Go fullscreen
#fff395
copy
#7459dc
copy
#41b3ff
copy
#63f5ef
copy
CSS Code
Go fullscreen
#011f3f
copy
#0960bd
copy
#429ffd
copy
#fef2bf
copy
CSS Code
Go fullscreen
#00204a
copy
#005792
copy
#448ef6
copy
#fdb44b
copy
CSS Code
Go fullscreen
#f6f6d9
copy
#47e4e0
copy
#5f81e4
copy
#f67ff5
copy
CSS Code
Go fullscreen
#081f37
copy
#5fc9f3
copy
#2e79ba
copy
#1e549f
copy
CSS Code
Go fullscreen
#0b88a8
copy
#a6dc8c
copy
#dfeb95
copy
#095062
copy
CSS Code
Go fullscreen
#ffd1bd
copy
#ffb0cd
copy
#ffffff
copy
#c2f0fc
copy
CSS Code
Go fullscreen
#020438
copy
#284184
copy
#1f8ea3
copy
#00eaff
copy
CSS Code
Go fullscreen
#ffebbc
copy
#5da7ae
copy
#543d46
copy
#292830
copy
CSS Code
Go fullscreen
#dd0a35
copy
#e4d1d3
copy
#1687a7
copy
#014955
copy
CSS Code
Go fullscreen
#7696db
copy
#562d7d
copy
#ae427b
copy
#ff8a98
copy
CSS Code
Go fullscreen
#90aeff
copy
#cefc86
copy
#60efb8
copy
#f9f7f7
copy
CSS Code
Go fullscreen
#7fcbd7
copy
#857ebb
copy
#ca9dd7
copy
#facbd3
copy
CSS Code
Go fullscreen
#f47c7c
copy
#f7f48b
copy
#a1de93
copy
#70a1d7
copy
CSS Code
Go fullscreen
#3fc5f0
copy
#42dee1
copy
#6decb9
copy
#eef5b2
copy
CSS Code
Go fullscreen
#f0f08e
copy
#91ca62
copy
#478077
copy
#3a4874
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.