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
#5585b5
copy
#53a8b6
copy
#79c2d0
copy
#bbe4e9
copy
CSS Code
Go fullscreen
#6fe7dd
copy
#3490de
copy
#6639a6
copy
#521262
copy
CSS Code
Go fullscreen
#f2f7ff
copy
#0b409c
copy
#10316b
copy
#ffce63
copy
CSS Code
Go fullscreen
#083c5a
copy
#4cb648
copy
#fcc72c
copy
#e4f4fd
copy
CSS Code
Go fullscreen
#e7eaf6
copy
#a2a8d3
copy
#38598b
copy
#113f67
copy
CSS Code
Go fullscreen
#1d7d81
copy
#213458
copy
#887575
copy
#f6e8e8
copy
CSS Code
Go fullscreen
#29c6cd
copy
#f6e4c4
copy
#fea386
copy
#f19584
copy
CSS Code
Go fullscreen
#111f4d
copy
#f2f4f7
copy
#e43a19
copy
#020205
copy
CSS Code
Go fullscreen
#c8f0f0
copy
#86d8dc
copy
#7047a3
copy
#3a276a
copy
CSS Code
Go fullscreen
#f5b17b
copy
#4e709d
copy
#89a4c7
copy
#cdd5e0
copy
CSS Code
Go fullscreen
#efff9d
copy
#2aa9d2
copy
#1874c3
copy
#2931b3
copy
CSS Code
Go fullscreen
#edf7fa
copy
#5f6caf
copy
#ffb677
copy
#ff8364
copy
CSS Code
Go fullscreen
#e67676
copy
#f2f062
copy
#a9e6e6
copy
#7692e4
copy
CSS Code
Go fullscreen
#ee8374
copy
#54567a
copy
#dab784
copy
#f8f3b6
copy
CSS Code
Go fullscreen
#d5eeff
copy
#f7ca44
copy
#a2792f
copy
#5c3c10
copy
CSS Code
Go fullscreen
#fafafa
copy
#e8f1f5
copy
#005691
copy
#004a7c
copy
CSS Code
Go fullscreen
#4d089a
copy
#323edd
copy
#dc2ade
copy
#e8f044
copy
CSS Code
Go fullscreen
#900c3f
copy
#c70039
copy
#ff5733
copy
#ffc300
copy
CSS Code
Go fullscreen
#686ee2
copy
#5c3e84
copy
#f35c6e
copy
#ffa87b
copy
CSS Code
Go fullscreen
#288fb4
copy
#1d556f
copy
#efddb2
copy
#fa360a
copy
CSS Code
Go fullscreen
#397298
copy
#8ac4ff
copy
#9179ef
copy
#7b417d
copy
CSS Code
Go fullscreen
#3fc5f0
copy
#42dee1
copy
#6decb9
copy
#eef5b2
copy
CSS Code
Go fullscreen
#f35f5f
copy
#cc435f
copy
#f1ea65
copy
#36a3eb
copy
CSS Code
Go fullscreen
#d2fafb
copy
#5acfd6
copy
#189bfa
copy
#0c4b8e
copy
CSS Code
Go fullscreen
#daebee
copy
#b6d7de
copy
#fcedda
copy
#ff5126
copy
CSS Code
Go fullscreen
#f7e74a
copy
#09c6ab
copy
#068888
copy
#02556d
copy
CSS Code
Go fullscreen
#639cd9
copy
#5454c5
copy
#342056
copy
#220e24
copy
CSS Code
Go fullscreen
#7c6fff
copy
#5ca9ff
copy
#fcff90
copy
#ffde68
copy
CSS Code
Go fullscreen
#006c9a
copy
#00bebe
copy
#00f3e4
copy
#9ff9c1
copy
CSS Code
Go fullscreen
#bad7df
copy
#ffe2e2
copy
#f6f6f6
copy
#99ddcc
copy
CSS Code
Go fullscreen
#c2ffff
copy
#8bdeff
copy
#a888ff
copy
#26466f
copy
CSS Code
Go fullscreen
#73f7dd
copy
#2cc4cb
copy
#1972a4
copy
#2e3a87
copy
CSS Code
Go fullscreen
#f7f373
copy
#65d269
copy
#2d8b7d
copy
#2f64a3
copy
CSS Code
Go fullscreen
#f96d6d
copy
#b84d69
copy
#a9d7f6
copy
#8fb1e9
copy
CSS Code
Go fullscreen
#ffdfdf
copy
#fbc1bc
copy
#315b96
copy
#233567
copy
CSS Code
Go fullscreen
#76508e
copy
#482d57
copy
#03c1eb
copy
#86f3b8
copy
CSS Code
Go fullscreen
#f85f73
copy
#fbe8d3
copy
#928a97
copy
#283c63
copy
CSS Code
Go fullscreen
#001f3f
copy
#083358
copy
#0d63a5
copy
#ffd717
copy
CSS Code
Go fullscreen
#45eba5
copy
#21aba5
copy
#1d566e
copy
#163a5f
copy
CSS Code
Go fullscreen
#303841
copy
#47555e
copy
#7aa5d2
copy
#eeeeee
copy
CSS Code
Go fullscreen
#415f77
copy
#d1e9ea
copy
#fc5050
copy
#ffd00c
copy
CSS Code
Go fullscreen
#2b3964
copy
#3482aa
copy
#6db3b5
copy
#f9cc7b
copy
CSS Code
Go fullscreen
#ffebbc
copy
#5da7ae
copy
#543d46
copy
#292830
copy
CSS Code
Go fullscreen
#b9dbe6
copy
#5f818a
copy
#36595f
copy
#304852
copy
CSS Code
Go fullscreen
#2e99b0
copy
#fcd77f
copy
#ff2e4c
copy
#1e1548
copy
CSS Code
Go fullscreen
#b7b9f4
copy
#5254d8
copy
#192294
copy
#000278
copy
CSS Code
Go fullscreen
#1b262c
copy
#0f4c75
copy
#3282b8
copy
#bbe1fa
copy
CSS Code
Go fullscreen
#d3f6f3
copy
#f9fce1
copy
#fee9b2
copy
#fbd1b7
copy
CSS Code
Go fullscreen
#19215e
copy
#f7e6b5
copy
#fa67ab
copy
#80185f
copy
CSS Code
Go fullscreen
#f4f7f7
copy
#aacfd0
copy
#79a8a9
copy
#1f4e5f
copy
CSS Code
Go fullscreen
#022c43
copy
#053f5e
copy
#115173
copy
#ffd700
copy
CSS Code
Go fullscreen
#fafbd4
copy
#b2ebf9
copy
#aea1ea
copy
#8c54a1
copy
CSS Code
Go fullscreen
#76d3ff
copy
#d78bff
copy
#fffa9d
copy
#ffbd74
copy
CSS Code
Go fullscreen
#7696db
copy
#562d7d
copy
#ae427b
copy
#ff8a98
copy
CSS Code
Go fullscreen
#062d92
copy
#046fdb
copy
#03d6d2
copy
#fffcbf
copy
CSS Code
Go fullscreen
#fcfcfc
copy
#0fc9e7
copy
#3186b2
copy
#4756ca
copy
CSS Code
Go fullscreen
#fdf196
copy
#c5fcda
copy
#98e5ec
copy
#67bac6
copy
CSS Code
Go fullscreen
#921224
copy
#bce0da
copy
#ebf5ee
copy
#bdc6b8
copy
CSS Code
Go fullscreen
#fafdcb
copy
#aee7e8
copy
#28c3d4
copy
#248ea9
copy
CSS Code
Go fullscreen
#1a2634
copy
#203e5f
copy
#ffcc00
copy
#fee5b1
copy
CSS Code
Go fullscreen
#48f3db
copy
#51c4e9
copy
#6150c1
copy
#4a3764
copy
CSS Code
Go fullscreen
#4c5f7a
copy
#393e6f
copy
#3d2e4f
copy
#321d2f
copy
CSS Code
Go fullscreen
#f46188
copy
#491d7f
copy
#642ab6
copy
#7779ff
copy
CSS Code
Go fullscreen
#89fad0
copy
#4ec9e1
copy
#6796e5
copy
#228291
copy
CSS Code
Go fullscreen
#b6e1e0
copy
#9cd3d3
copy
#e8630a
copy
#2b4353
copy
CSS Code
Go fullscreen
#fd5959
copy
#ff9c6d
copy
#fcff82
copy
#afc5ff
copy
CSS Code
Go fullscreen
#2e94b9
copy
#475053
copy
#acdcee
copy
#f0fbff
copy
CSS Code
Go fullscreen
#002bdc
copy
#2f4bff
copy
#00a6e7
copy
#ffe37f
copy
CSS Code
Go fullscreen
#1b3c68
copy
#0074e4
copy
#00b8c0
copy
#e9ffb2
copy
CSS Code
Go fullscreen
#294a66
copy
#0b3846
copy
#ffbbbb
copy
#fcd2c2
copy
CSS Code
Go fullscreen
#fba834
copy
#fce850
copy
#387adf
copy
#50c4ed
copy
CSS Code
Go fullscreen
#ece493
copy
#84a1be
copy
#5c7893
copy
#535962
copy
CSS Code
Go fullscreen
#ffffd2
copy
#e4e4e4
copy
#8293ff
copy
#503bff
copy
CSS Code
Go fullscreen
#f0f0f0
copy
#43dde6
copy
#364f6b
copy
#fc5185
copy
CSS Code
Go fullscreen
#fce38a
copy
#0e5f76
copy
#083d56
copy
#0c2233
copy
CSS Code
Go fullscreen
#65e892
copy
#3994d6
copy
#354abf
copy
#3d289b
copy
CSS Code
Go fullscreen
#fffac0
copy
#ffd79a
copy
#73b9d7
copy
#9de6e8
copy
CSS Code
Go fullscreen
#247291
copy
#f8da5b
copy
#eef2e2
copy
#f5f9ee
copy
CSS Code
Go fullscreen
#233142
copy
#455d7a
copy
#f95959
copy
#facf5a
copy
CSS Code
Go fullscreen
#f9fd50
copy
#85ef47
copy
#00bd56
copy
#207dff
copy
CSS Code
Go fullscreen
#f9f8eb
copy
#ffe1b6
copy
#7a9eb1
copy
#415865
copy
CSS Code
Go fullscreen
#1b435d
copy
#78bbe6
copy
#d5eeff
copy
#ff895d
copy
CSS Code
Go fullscreen
#1684a7
copy
#09a599
copy
#f6ec72
copy
#f6f6f6
copy
CSS Code
Go fullscreen
#f2f7ff
copy
#0b409c
copy
#10316b
copy
#ffe867
copy
CSS Code
Go fullscreen
#f5fac8
copy
#aee8e6
copy
#8bcfcc
copy
#539092
copy
CSS Code
Go fullscreen
#f9fcfd
copy
#c9eff9
copy
#07a4b5
copy
#fed8a7
copy
CSS Code
Go fullscreen
#3ec1d3
copy
#f6f7d7
copy
#ff9a00
copy
#ff165d
copy
CSS Code
Go fullscreen
#f0f08e
copy
#91ca62
copy
#478077
copy
#3a4874
copy
CSS Code
Go fullscreen
#001f3f
copy
#083358
copy
#0da574
copy
#ffd717
copy
CSS Code
Go fullscreen
#293462
copy
#216583
copy
#00818a
copy
#f7be16
copy
CSS Code
Go fullscreen
#e9f679
copy
#9bdf46
copy
#25a55f
copy
#346473
copy
CSS Code
Go fullscreen
#f3ff92
copy
#f6ce59
copy
#2e8fc6
copy
#56cfd2
copy
CSS Code
Go fullscreen
#000033
copy
#0066cc
copy
#0099ff
copy
#ededed
copy
CSS Code
Go fullscreen
#c84361
copy
#e78775
copy
#abcdcb
copy
#ebe59b
copy
CSS Code
Go fullscreen
#7b99fa
copy
#53cdd8
copy
#96eab7
copy
#f1f3b8
copy
CSS Code
Go fullscreen
#dd0a35
copy
#e4d1d3
copy
#1687a7
copy
#014955
copy
CSS Code
Go fullscreen
#f3f6f6
copy
#90eee1
copy
#55b3f3
copy
#6356e5
copy
CSS Code
Go fullscreen
#8ecccc
copy
#50717b
copy
#3a4042
copy
#212121
copy
CSS Code
Go fullscreen
#e7e6e1
copy
#f7f6e7
copy
#c1c0b9
copy
#537791
copy
CSS Code
Go fullscreen
#000249
copy
#0f4392
copy
#ff5151
copy
#ff8b8b
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.