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
#d2fafb
copy
#51dacf
copy
#41aaa8
copy
#2c003e
copy
CSS Code
Go fullscreen
#bc5148
copy
#fef8e6
copy
#7bcecc
copy
#3090a1
copy
CSS Code
Go fullscreen
#f6490d
copy
#000249
copy
#1dced8
copy
#faf9f0
copy
CSS Code
Go fullscreen
#eae7ed
copy
#b793e6
copy
#646ecb
copy
#3532a7
copy
CSS Code
Go fullscreen
#d3f6f3
copy
#f9fce1
copy
#fee9b2
copy
#fbd1b7
copy
CSS Code
Go fullscreen
#404b69
copy
#283149
copy
#f73859
copy
#f3ecc8
copy
CSS Code
Go fullscreen
#ebfffa
copy
#c6fce5
copy
#6ef3d6
copy
#0dceda
copy
CSS Code
Go fullscreen
#2e94b9
copy
#fffdc1
copy
#f0b775
copy
#fd5959
copy
CSS Code
Go fullscreen
#211572
copy
#24bddf
copy
#f4f4f4
copy
#fffdbb
copy
CSS Code
Go fullscreen
#35477d
copy
#6c5b7b
copy
#c06c84
copy
#f67280
copy
CSS Code
Go fullscreen
#22559c
copy
#f27370
copy
#fa9856
copy
#ede862
copy
CSS Code
Go fullscreen
#ecf0f1
copy
#33cccc
copy
#2980b9
copy
#2c3e50
copy
CSS Code
Go fullscreen
#2f3c4f
copy
#506f86
copy
#fbb040
copy
#de703c
copy
CSS Code
Go fullscreen
#232855
copy
#215b63
copy
#5fcc9c
copy
#aaffc7
copy
CSS Code
Go fullscreen
#364f6b
copy
#3fc1c9
copy
#fce38a
copy
#fc5185
copy
CSS Code
Go fullscreen
#f3ff92
copy
#f6ce59
copy
#2e8fc6
copy
#56cfd2
copy
CSS Code
Go fullscreen
#182952
copy
#2b3595
copy
#7045af
copy
#e14594
copy
CSS Code
Go fullscreen
#ffdd83
copy
#e3f8ff
copy
#31bccc
copy
#405983
copy
CSS Code
Go fullscreen
#002bdc
copy
#2f4bff
copy
#00a6e7
copy
#ffe37f
copy
CSS Code
Go fullscreen
#f1fcfd
copy
#c7eeff
copy
#4d6de3
copy
#393737
copy
CSS Code
Go fullscreen
#dd0a35
copy
#e4d1d3
copy
#1687a7
copy
#014955
copy
CSS Code
Go fullscreen
#f3ecc8
copy
#78c2c3
copy
#3f6699
copy
#0d1b4c
copy
CSS Code
Go fullscreen
#4d606e
copy
#3fbac2
copy
#d3d4d8
copy
#f5f5f5
copy
CSS Code
Go fullscreen
#921224
copy
#bce0da
copy
#ebf5ee
copy
#bdc6b8
copy
CSS Code
Go fullscreen
#f38181
copy
#fce38a
copy
#d6f7ad
copy
#95e1d3
copy
CSS Code
Go fullscreen
#c6f1a2
copy
#a8d966
copy
#43a367
copy
#385380
copy
CSS Code
Go fullscreen
#00204a
copy
#005792
copy
#00bbf0
copy
#fdb44b
copy
CSS Code
Go fullscreen
#8be3e1
copy
#d3f7ad
copy
#95bb76
copy
#97935c
copy
CSS Code
Go fullscreen
#99e1e5
copy
#f3e8cb
copy
#f2c6b4
copy
#fbafaf
copy
CSS Code
Go fullscreen
#ffd1bd
copy
#ffb0cd
copy
#ffffff
copy
#c2f0fc
copy
CSS Code
Go fullscreen
#ffdd93
copy
#58dada
copy
#1ca2bb
copy
#005e7c
copy
CSS Code
Go fullscreen
#07689f
copy
#a2d5f2
copy
#fafafa
copy
#ff7e67
copy
CSS Code
Go fullscreen
#f23557
copy
#f0d43a
copy
#22b2da
copy
#3b4a6b
copy
CSS Code
Go fullscreen
#e4fffe
copy
#a4f6f9
copy
#ff99fe
copy
#ba52ed
copy
CSS Code
Go fullscreen
#2c2955
copy
#4c5fb1
copy
#f9f194
copy
#cdd582
copy
CSS Code
Go fullscreen
#80ffdb
copy
#55e0a3
copy
#5b70f3
copy
#4850b9
copy
CSS Code
Go fullscreen
#2a528a
copy
#5d6ec7
copy
#9f71db
copy
#e9d498
copy
CSS Code
Go fullscreen
#151680
copy
#1c44ac
copy
#375fc0
copy
#f1fea4
copy
CSS Code
Go fullscreen
#f5ff8d
copy
#50cb86
copy
#4c74c9
copy
#312f44
copy
CSS Code
Go fullscreen
#feffdf
copy
#dde0ab
copy
#97cba9
copy
#668ba4
copy
CSS Code
Go fullscreen
#bff4ed
copy
#280f34
copy
#b30753
copy
#f6c667
copy
CSS Code
Go fullscreen
#f9fa9b
copy
#ff7777
copy
#ceecf0
copy
#f0f3f3
copy
CSS Code
Go fullscreen
#b590ca
copy
#a8d3da
copy
#f5cab3
copy
#f3ecb8
copy
CSS Code
Go fullscreen
#08085e
copy
#a2ef44
copy
#fff07a
copy
#e8fcf6
copy
CSS Code
Go fullscreen
#f9fcfd
copy
#c9eff9
copy
#07a4b5
copy
#fed8a7
copy
CSS Code
Go fullscreen
#0b5269
copy
#03051e
copy
#978d58
copy
#eae1e1
copy
CSS Code
Go fullscreen
#fffd75
copy
#60e550
copy
#3b6ac0
copy
#6e3274
copy
CSS Code
Go fullscreen
#5f2f14
copy
#1297bd
copy
#1ad7db
copy
#f3f1f1
copy
CSS Code
Go fullscreen
#a8e0e1
copy
#5a96bb
copy
#75448c
copy
#c46caa
copy
CSS Code
Go fullscreen
#413c69
copy
#4a47a3
copy
#ad62aa
copy
#f4b0c7
copy
CSS Code
Go fullscreen
#0c2233
copy
#065471
copy
#0a91ab
copy
#ffc045
copy
CSS Code
Go fullscreen
#fffdb7
copy
#aef4a4
copy
#79b8d1
copy
#e36488
copy
CSS Code
Go fullscreen
#062c80
copy
#0e6ac7
copy
#4fb9fc
copy
#f6f5da
copy
CSS Code
Go fullscreen
#639cd9
copy
#5454c5
copy
#342056
copy
#220e24
copy
CSS Code
Go fullscreen
#a6f2db
copy
#7bcace
copy
#678eb4
copy
#4f4e79
copy
CSS Code
Go fullscreen
#defcf9
copy
#cadefc
copy
#c3bef0
copy
#cca8e9
copy
CSS Code
Go fullscreen
#111d5e
copy
#b21f66
copy
#fe346e
copy
#ffbd69
copy
CSS Code
Go fullscreen
#f7aa00
copy
#235784
copy
#40a8c4
copy
#bcdbdf
copy
CSS Code
Go fullscreen
#bef2ff
copy
#4f7097
copy
#93a7d1
copy
#1bf5af
copy
CSS Code
Go fullscreen
#00334e
copy
#145374
copy
#5588a3
copy
#e8e8e8
copy
CSS Code
Go fullscreen
#e8e8e8
copy
#5588a3
copy
#145374
copy
#00334e
copy
CSS Code
Go fullscreen
#f67280
copy
#c06c84
copy
#6c5b7b
copy
#35477d
copy
CSS Code
Go fullscreen
#3c415e
copy
#738598
copy
#dfe2e2
copy
#1cb3c8
copy
CSS Code
Go fullscreen
#2f3c4f
copy
#506e86
copy
#fcb040
copy
#de703b
copy
CSS Code
Go fullscreen
#27296d
copy
#5e63b6
copy
#a393eb
copy
#f5c7f7
copy
CSS Code
Go fullscreen
#eff0f4
copy
#74dbef
copy
#0074e4
copy
#264e86
copy
CSS Code
Go fullscreen
#272343
copy
#ffffff
copy
#e3f6f5
copy
#bae8e8
copy
CSS Code
Go fullscreen
#6c5ce7
copy
#7b88ff
copy
#fdcb6e
copy
#fff3b1
copy
CSS Code
Go fullscreen
#f6eb9a
copy
#5853bc
copy
#362391
copy
#1c0c59
copy
CSS Code
Go fullscreen
#294a66
copy
#0b3846
copy
#ffbbbb
copy
#fcd2c2
copy
CSS Code
Go fullscreen
#ffdaa9
copy
#6fa3a9
copy
#5f72b2
copy
#60366f
copy
CSS Code
Go fullscreen
#f33535
copy
#d8e9f0
copy
#33425b
copy
#29252c
copy
CSS Code
Go fullscreen
#2d5c7f
copy
#fff1a8
copy
#ff8f56
copy
#984a59
copy
CSS Code
Go fullscreen
#3498db
copy
#ecf0f1
copy
#34495e
copy
#f1c40f
copy
CSS Code
Go fullscreen
#7b99fa
copy
#53cdd8
copy
#96eab7
copy
#f1f3b8
copy
CSS Code
Go fullscreen
#14103b
copy
#f02a71
copy
#7ec0e4
copy
#6789ba
copy
CSS Code
Go fullscreen
#ff9393
copy
#ff6767
copy
#ff3434
copy
#0c317a
copy
CSS Code
Go fullscreen
#5c4b77
copy
#6990e4
copy
#b145ad
copy
#f6a2d4
copy
CSS Code
Go fullscreen
#d4a5a5
copy
#ffecda
copy
#f9ffea
copy
#a6d0e4
copy
CSS Code
Go fullscreen
#b8eef1
copy
#bf68f6
copy
#fd89dd
copy
#f0e48e
copy
CSS Code
Go fullscreen
#4d12ee
copy
#2f24c1
copy
#3fd1cb
copy
#f8f6f6
copy
CSS Code
Go fullscreen
#3b939b
copy
#2f8189
copy
#91f3fc
copy
#c9fbff
copy
CSS Code
Go fullscreen
#0c084c
copy
#096386
copy
#00b7a8
copy
#f0eec8
copy
CSS Code
Go fullscreen
#ffffe3
copy
#87e0ff
copy
#53c7f0
copy
#1d97c1
copy
CSS Code
Go fullscreen
#4e4e6a
copy
#1f6cb0
copy
#70a3c4
copy
#e7e8f5
copy
CSS Code
Go fullscreen
#0278ae
copy
#51dacf
copy
#9ef5cf
copy
#e8ffc1
copy
CSS Code
Go fullscreen
#f2ff9b
copy
#6af79a
copy
#57acc5
copy
#444b6c
copy
CSS Code
Go fullscreen
#247291
copy
#f8da5b
copy
#eef2e2
copy
#f5f9ee
copy
CSS Code
Go fullscreen
#fb929e
copy
#ffdfdf
copy
#fff6f6
copy
#aedefc
copy
CSS Code
Go fullscreen
#ff304f
copy
#002651
copy
#775ada
copy
#28c7fa
copy
CSS Code
Go fullscreen
#1a2849
copy
#505bda
copy
#b063c5
copy
#ffaac3
copy
CSS Code
Go fullscreen
#f7f4ea
copy
#9ce3cf
copy
#6a7ff5
copy
#574b9b
copy
CSS Code
Go fullscreen
#39627f
copy
#4b788f
copy
#e4de66
copy
#beb000
copy
CSS Code
Go fullscreen
#48829e
copy
#51dacf
copy
#9ef5cf
copy
#e8ffb1
copy
CSS Code
Go fullscreen
#48466d
copy
#3d84a8
copy
#46cdcf
copy
#abedd8
copy
CSS Code
Go fullscreen
#634258
copy
#6d6087
copy
#60a0b0
copy
#9ad1aa
copy
CSS Code
Go fullscreen
#ddf516
copy
#12e2a3
copy
#389168
copy
#0f117a
copy
CSS Code
Go fullscreen
#f3f9fb
copy
#474f85
copy
#51e3d4
copy
#f3ecd3
copy
CSS Code
Go fullscreen
#7fcbd7
copy
#857ebb
copy
#ca9dd7
copy
#facbd3
copy
CSS Code
Go fullscreen
#f5b17b
copy
#4e709d
copy
#89a4c7
copy
#cdd5e0
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.