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
#6fe7dd
copy
#3490de
copy
#6639a6
copy
#521262
copy
CSS Code
Go fullscreen
#14103b
copy
#f02a71
copy
#7ec0e4
copy
#6789ba
copy
CSS Code
Go fullscreen
#efff9d
copy
#2aa9d2
copy
#1874c3
copy
#2931b3
copy
CSS Code
Go fullscreen
#2f3c4f
copy
#506e86
copy
#fcb040
copy
#de703b
copy
CSS Code
Go fullscreen
#bff4ed
copy
#280f34
copy
#e41655
copy
#b30753
copy
CSS Code
Go fullscreen
#f6eb9a
copy
#5853bc
copy
#362391
copy
#1c0c59
copy
CSS Code
Go fullscreen
#f8ed86
copy
#a5e9db
copy
#2ca4bf
copy
#415b90
copy
CSS Code
Go fullscreen
#f7f4ea
copy
#9ce3cf
copy
#6a7ff5
copy
#574b9b
copy
CSS Code
Go fullscreen
#f9fa9b
copy
#ff7777
copy
#ceecf0
copy
#f0f3f3
copy
CSS Code
Go fullscreen
#1a2634
copy
#203e5f
copy
#ffcc00
copy
#fee5b1
copy
CSS Code
Go fullscreen
#f5fac8
copy
#aee8e6
copy
#8bcfcc
copy
#539092
copy
CSS Code
Go fullscreen
#07588a
copy
#6ac1b8
copy
#bfe9db
copy
#e1f6f4
copy
CSS Code
Go fullscreen
#e1f5f2
copy
#6bc5d2
copy
#5a5d9d
copy
#390050
copy
CSS Code
Go fullscreen
#4ac6b7
copy
#4f5e7f
copy
#965f8a
copy
#ff7070
copy
CSS Code
Go fullscreen
#900c3f
copy
#c70039
copy
#ff5733
copy
#ffc300
copy
CSS Code
Go fullscreen
#0f3057
copy
#00587a
copy
#008891
copy
#e7e7de
copy
CSS Code
Go fullscreen
#ee8374
copy
#54567a
copy
#dab784
copy
#f8f3b6
copy
CSS Code
Go fullscreen
#beeef7
copy
#6fc2d0
copy
#373a6d
copy
#ff8246
copy
CSS Code
Go fullscreen
#0c005a
copy
#bc2525
copy
#ff0000
copy
#eaeaea
copy
CSS Code
Go fullscreen
#fff395
copy
#7459dc
copy
#41b3ff
copy
#63f5ef
copy
CSS Code
Go fullscreen
#84b9ef
copy
#fbe4c9
copy
#ff5d5d
copy
#952e4b
copy
CSS Code
Go fullscreen
#f9fd50
copy
#85ef47
copy
#00bd56
copy
#207dff
copy
CSS Code
Go fullscreen
#f2f7ff
copy
#0b409c
copy
#10316b
copy
#ffce63
copy
CSS Code
Go fullscreen
#e4f1fe
copy
#8dc6ff
copy
#22313f
copy
#34495e
copy
CSS Code
Go fullscreen
#022c43
copy
#053f5e
copy
#115173
copy
#ffd700
copy
CSS Code
Go fullscreen
#b0deff
copy
#ffc5a1
copy
#ffd19a
copy
#fff8a6
copy
CSS Code
Go fullscreen
#062743
copy
#113a5d
copy
#c4ffdd
copy
#f9f9f9
copy
CSS Code
Go fullscreen
#fd5959
copy
#ff9c6d
copy
#fcff82
copy
#afc5ff
copy
CSS Code
Go fullscreen
#2f2342
copy
#e42f45
copy
#b42b3f
copy
#7ca0e5
copy
CSS Code
Go fullscreen
#eef2f5
copy
#ea168e
copy
#612570
copy
#1eafed
copy
CSS Code
Go fullscreen
#3f52e3
copy
#f6f6f6
copy
#efe891
copy
#f12d2d
copy
CSS Code
Go fullscreen
#f3ff92
copy
#f6ce59
copy
#2e8fc6
copy
#56cfd2
copy
CSS Code
Go fullscreen
#4cb3cd
copy
#52d6d3
copy
#5968b1
copy
#302579
copy
CSS Code
Go fullscreen
#01005e
copy
#22267b
copy
#28518a
copy
#17b794
copy
CSS Code
Go fullscreen
#1b3c59
copy
#456173
copy
#11bfae
copy
#f2f2f0
copy
CSS Code
Go fullscreen
#f1fafb
copy
#a0e4f1
copy
#9dc6ff
copy
#4993fa
copy
CSS Code
Go fullscreen
#fad3cf
copy
#a696c8
copy
#2470a0
copy
#060608
copy
CSS Code
Go fullscreen
#ff5656
copy
#edf2f6
copy
#6a7efc
copy
#494953
copy
CSS Code
Go fullscreen
#dcb5ff
copy
#d9f2ff
copy
#a5bdfd
copy
#77529e
copy
CSS Code
Go fullscreen
#1d2b53
copy
#7e2553
copy
#ff004d
copy
#fff024
copy
CSS Code
Go fullscreen
#d5def5
copy
#8594e4
copy
#6643b5
copy
#430f58
copy
CSS Code
Go fullscreen
#e4f5e5
copy
#a6dfde
copy
#88a6e5
copy
#8d6ec8
copy
CSS Code
Go fullscreen
#ffc7c7
copy
#ff80b0
copy
#9399ff
copy
#a9fffd
copy
CSS Code
Go fullscreen
#48829e
copy
#51dacf
copy
#9ef5cf
copy
#e8ffb1
copy
CSS Code
Go fullscreen
#f6f6d9
copy
#47e4e0
copy
#5f81e4
copy
#f67ff5
copy
CSS Code
Go fullscreen
#7a9eaf
copy
#655989
copy
#de88a5
copy
#ffcebb
copy
CSS Code
Go fullscreen
#bef2ff
copy
#4f7097
copy
#93a7d1
copy
#1bf5af
copy
CSS Code
Go fullscreen
#a1d9ff
copy
#ca82f8
copy
#ed93cb
copy
#f2bbbb
copy
CSS Code
Go fullscreen
#faee5a
copy
#e4fcf9
copy
#ace6f6
copy
#4b89ac
copy
CSS Code
Go fullscreen
#3e6545
copy
#9973e2
copy
#82ceda
copy
#ecffb1
copy
CSS Code
Go fullscreen
#29d2e4
copy
#13829b
copy
#fcc29a
copy
#fde9c9
copy
CSS Code
Go fullscreen
#f46188
copy
#491d7f
copy
#642ab6
copy
#7779ff
copy
CSS Code
Go fullscreen
#fffeec
copy
#aeddcd
copy
#e4508f
copy
#556fb5
copy
CSS Code
Go fullscreen
#353b6e
copy
#252243
copy
#74deed
copy
#9365db
copy
CSS Code
Go fullscreen
#18587a
copy
#fc624d
copy
#fca7a7
copy
#ffd6d6
copy
CSS Code
Go fullscreen
#80a3a2
copy
#abcecf
copy
#c4dce0
copy
#daf4f5
copy
CSS Code
Go fullscreen
#f6efb4
copy
#35c2bd
copy
#2796cb
copy
#3379e4
copy
CSS Code
Go fullscreen
#2f3c4f
copy
#506f86
copy
#fbb040
copy
#de703c
copy
CSS Code
Go fullscreen
#f8fcfb
copy
#c9fdd7
copy
#79d1c3
copy
#6892d5
copy
CSS Code
Go fullscreen
#b8f7d4
copy
#6fe7db
copy
#7fa6ee
copy
#835af1
copy
CSS Code
Go fullscreen
#f9c4ac
copy
#626f92
copy
#474168
copy
#272637
copy
CSS Code
Go fullscreen
#211572
copy
#24bddf
copy
#f4f4f4
copy
#fffdbb
copy
CSS Code
Go fullscreen
#fafcd6
copy
#259f6c
copy
#1e6b7f
copy
#140303
copy
CSS Code
Go fullscreen
#ffabe5
copy
#c7f5ff
copy
#d89fff
copy
#f6fcae
copy
CSS Code
Go fullscreen
#c2faf1
copy
#f6f6f6
copy
#dfeff0
copy
#295e6a
copy
CSS Code
Go fullscreen
#fba834
copy
#fce850
copy
#387adf
copy
#50c4ed
copy
CSS Code
Go fullscreen
#734488
copy
#492645
copy
#9febeb
copy
#fafcdb
copy
CSS Code
Go fullscreen
#c7f5fe
copy
#fcc8f8
copy
#eab4f8
copy
#f3f798
copy
CSS Code
Go fullscreen
#36626a
copy
#588d9c
copy
#73b1c1
copy
#f1d18a
copy
CSS Code
Go fullscreen
#fafbd4
copy
#b2ebf9
copy
#aea1ea
copy
#8c54a1
copy
CSS Code
Go fullscreen
#343434
copy
#2d4059
copy
#ea5455
copy
#fde9c9
copy
CSS Code
Go fullscreen
#090088
copy
#930077
copy
#e4007c
copy
#ffbd39
copy
CSS Code
Go fullscreen
#364968
copy
#fddf97
copy
#e09664
copy
#6c4343
copy
CSS Code
Go fullscreen
#155674
copy
#60beb3
copy
#79f8bb
copy
#f5ffae
copy
CSS Code
Go fullscreen
#beebe9
copy
#f4dada
copy
#ffb6b9
copy
#f6eec7
copy
CSS Code
Go fullscreen
#b2b7ff
copy
#d5e8ff
copy
#d9a2f1
copy
#d86f9b
copy
CSS Code
Go fullscreen
#fcf9ea
copy
#badfdb
copy
#49beb7
copy
#ff8a5c
copy
CSS Code
Go fullscreen
#0b88a8
copy
#a6dc8c
copy
#dfeb95
copy
#095062
copy
CSS Code
Go fullscreen
#1a2c5b
copy
#3e4e88
copy
#7971ea
copy
#b8dff0
copy
CSS Code
Go fullscreen
#233142
copy
#4f9da6
copy
#facf5a
copy
#ff5959
copy
CSS Code
Go fullscreen
#001f3f
copy
#083358
copy
#0d63a5
copy
#ffd717
copy
CSS Code
Go fullscreen
#1b262c
copy
#0f4c81
copy
#ed6663
copy
#ffa372
copy
CSS Code
Go fullscreen
#ecf0f1
copy
#33cccc
copy
#2980b9
copy
#2c3e50
copy
CSS Code
Go fullscreen
#1684a7
copy
#09a599
copy
#f6ec72
copy
#f6f6f6
copy
CSS Code
Go fullscreen
#4d089a
copy
#323edd
copy
#dc2ade
copy
#e8f044
copy
CSS Code
Go fullscreen
#11cbd7
copy
#9feed1
copy
#fff6a2
copy
#f60c86
copy
CSS Code
Go fullscreen
#194769
copy
#f6f6e9
copy
#d7eef2
copy
#f2855e
copy
CSS Code
Go fullscreen
#151680
copy
#1c44ac
copy
#375fc0
copy
#f1fea4
copy
CSS Code
Go fullscreen
#d2fafb
copy
#5acfd6
copy
#189bfa
copy
#0c4b8e
copy
CSS Code
Go fullscreen
#152a38
copy
#29435c
copy
#556e53
copy
#d1d4c9
copy
CSS Code
Go fullscreen
#626eef
copy
#09a8fa
copy
#41c5d3
copy
#fffa9d
copy
CSS Code
Go fullscreen
#1b3764
copy
#4ab8b8
copy
#fafccb
copy
#efa35c
copy
CSS Code
Go fullscreen
#73f7dd
copy
#2cc4cb
copy
#1972a4
copy
#2e3a87
copy
CSS Code
Go fullscreen
#f6378f
copy
#ffdd00
copy
#f5efe8
copy
#8ea5eb
copy
CSS Code
Go fullscreen
#ececec
copy
#9fd3c7
copy
#385170
copy
#142d4c
copy
CSS Code
Go fullscreen
#f2f1a7
copy
#ef5959
copy
#b43144
copy
#88a9f7
copy
CSS Code
Go fullscreen
#634258
copy
#6d6087
copy
#60a0b0
copy
#9ad1aa
copy
CSS Code
Go fullscreen
#c7ffff
copy
#fbeeff
copy
#ebc6ff
copy
#7e80ff
copy
CSS Code
Go fullscreen
#0278ae
copy
#51adcf
copy
#a5ecd7
copy
#e8ffc1
copy
CSS Code
Go fullscreen
#010101
copy
#69779b
copy
#acdbdf
copy
#f0ece2
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.