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
#1a2c5b
copy
#3e4e88
copy
#7971ea
copy
#b8dff0
copy
CSS Code
Go fullscreen
#e3e8f8
copy
#c0c5cd
copy
#3e588f
copy
#203562
copy
CSS Code
Go fullscreen
#ffdaa9
copy
#6fa3a9
copy
#5f72b2
copy
#60366f
copy
CSS Code
Go fullscreen
#010101
copy
#69779b
copy
#acdbdf
copy
#f0ece2
copy
CSS Code
Go fullscreen
#fcf9ea
copy
#badfdb
copy
#49beb7
copy
#ff8a5c
copy
CSS Code
Go fullscreen
#2aaf74
copy
#4ed99c
copy
#d1ebfe
copy
#f7be7f
copy
CSS Code
Go fullscreen
#faf8f8
copy
#17ead9
copy
#6078ea
copy
#4b4848
copy
CSS Code
Go fullscreen
#c1f880
copy
#55c59d
copy
#4f5aa8
copy
#7481cf
copy
CSS Code
Go fullscreen
#090088
copy
#930077
copy
#e4007c
copy
#ffbd39
copy
CSS Code
Go fullscreen
#f6f6f6
copy
#d6e4f0
copy
#1e56a0
copy
#163172
copy
CSS Code
Go fullscreen
#fff56c
copy
#f1b149
copy
#4366a9
copy
#679ceb
copy
CSS Code
Go fullscreen
#2b4450
copy
#497285
copy
#dfebed
copy
#f78536
copy
CSS Code
Go fullscreen
#35477d
copy
#6c5b7b
copy
#c06c84
copy
#f67280
copy
CSS Code
Go fullscreen
#c2faf1
copy
#f6f6f6
copy
#dfeff0
copy
#295e6a
copy
CSS Code
Go fullscreen
#a1d9ff
copy
#ca82f8
copy
#ed93cb
copy
#f2bbbb
copy
CSS Code
Go fullscreen
#c8f0f0
copy
#86d8dc
copy
#7047a3
copy
#3a276a
copy
CSS Code
Go fullscreen
#e7eaf6
copy
#a2a8d3
copy
#38598b
copy
#113f67
copy
CSS Code
Go fullscreen
#ff895d
copy
#d5eeff
copy
#78bbe6
copy
#1b435d
copy
CSS Code
Go fullscreen
#23425f
copy
#a64942
copy
#ff7844
copy
#ffab5e
copy
CSS Code
Go fullscreen
#dbf1f2
copy
#cd5555
copy
#882042
copy
#efedbb
copy
CSS Code
Go fullscreen
#fafaf6
copy
#00fff0
copy
#00d1ff
copy
#3d6cb9
copy
CSS Code
Go fullscreen
#404b69
copy
#283149
copy
#f73859
copy
#f3ecc8
copy
CSS Code
Go fullscreen
#f38181
copy
#fce38a
copy
#d6f7ad
copy
#95e1d3
copy
CSS Code
Go fullscreen
#f7aa00
copy
#235784
copy
#40a8c4
copy
#bcdbdf
copy
CSS Code
Go fullscreen
#ffdede
copy
#f7f3ce
copy
#c5ecbe
copy
#4797b1
copy
CSS Code
Go fullscreen
#c84361
copy
#e78775
copy
#abcdcb
copy
#ebe59b
copy
CSS Code
Go fullscreen
#fad3cf
copy
#a696c8
copy
#2470a0
copy
#060608
copy
CSS Code
Go fullscreen
#ff5d9e
copy
#8f71ff
copy
#82acff
copy
#8bffff
copy
CSS Code
Go fullscreen
#9a69e1
copy
#47429d
copy
#f7b7f3
copy
#e27393
copy
CSS Code
Go fullscreen
#6f4f8b
copy
#6d739d
copy
#7dbcc8
copy
#b9eaf5
copy
CSS Code
Go fullscreen
#d7df71
copy
#0e5f76
copy
#083d56
copy
#081e3f
copy
CSS Code
Go fullscreen
#2b007b
copy
#2f89fc
copy
#e7e6fc
copy
#dd7c1b
copy
CSS Code
Go fullscreen
#ffcbcb
copy
#ffb5b5
copy
#407088
copy
#132743
copy
CSS Code
Go fullscreen
#baf5f0
copy
#d17ae5
copy
#e889e5
copy
#f9fcc9
copy
CSS Code
Go fullscreen
#194769
copy
#f6f6e9
copy
#d7eef2
copy
#f2855e
copy
CSS Code
Go fullscreen
#f5fac8
copy
#a5f0e4
copy
#82c7eb
copy
#8ea1f0
copy
CSS Code
Go fullscreen
#00649f
copy
#01aac1
copy
#00dbe7
copy
#97ecc5
copy
CSS Code
Go fullscreen
#d2d4d6
copy
#7d8df6
copy
#5a4db2
copy
#ff771b
copy
CSS Code
Go fullscreen
#283149
copy
#404b69
copy
#f73859
copy
#dbedf3
copy
CSS Code
Go fullscreen
#e9f679
copy
#9bdf46
copy
#25a55f
copy
#346473
copy
CSS Code
Go fullscreen
#a6f2db
copy
#7bcace
copy
#678eb4
copy
#4f4e79
copy
CSS Code
Go fullscreen
#ffd1bd
copy
#ffb0cd
copy
#ffffff
copy
#c2f0fc
copy
CSS Code
Go fullscreen
#2b3964
copy
#3482aa
copy
#6db3b5
copy
#f9cc7b
copy
CSS Code
Go fullscreen
#288fb4
copy
#1d556f
copy
#efddb2
copy
#fa360a
copy
CSS Code
Go fullscreen
#2e99b0
copy
#fcd77f
copy
#ff2e4c
copy
#1e1548
copy
CSS Code
Go fullscreen
#fffac0
copy
#ffd79a
copy
#73b9d7
copy
#9de6e8
copy
CSS Code
Go fullscreen
#13334c
copy
#005792
copy
#f6f6e9
copy
#fd5f00
copy
CSS Code
Go fullscreen
#3fc5f0
copy
#42dee1
copy
#6decb9
copy
#eef5b2
copy
CSS Code
Go fullscreen
#f7f373
copy
#65d269
copy
#2d8b7d
copy
#2f64a3
copy
CSS Code
Go fullscreen
#b7b9f4
copy
#5254d8
copy
#192294
copy
#000278
copy
CSS Code
Go fullscreen
#e1f5f2
copy
#6bc5d2
copy
#5a5d9d
copy
#390050
copy
CSS Code
Go fullscreen
#d4ffa3
copy
#00d8b1
copy
#1f9ec7
copy
#3f7a9c
copy
CSS Code
Go fullscreen
#233142
copy
#36506c
copy
#a5def1
copy
#ebf7fd
copy
CSS Code
Go fullscreen
#f8c957
copy
#ecf0f1
copy
#3498db
copy
#34495e
copy
CSS Code
Go fullscreen
#ff5656
copy
#edf2f6
copy
#6a7efc
copy
#494953
copy
CSS Code
Go fullscreen
#f8ff95
copy
#7be77e
copy
#7a8cf0
copy
#a45fe6
copy
CSS Code
Go fullscreen
#fafafa
copy
#e1eeff
copy
#c2cfd8
copy
#543a3a
copy
CSS Code
Go fullscreen
#99e1e5
copy
#f3e8cb
copy
#f2c6b4
copy
#fbafaf
copy
CSS Code
Go fullscreen
#ffabe5
copy
#c7f5ff
copy
#d89fff
copy
#f6fcae
copy
CSS Code
Go fullscreen
#006c9a
copy
#00bebe
copy
#00f3e4
copy
#9ff9c1
copy
CSS Code
Go fullscreen
#375a7f
copy
#4d7cae
copy
#6a99cb
copy
#fcfa70
copy
CSS Code
Go fullscreen
#f4f7ed
copy
#86ee60
copy
#2e6e65
copy
#2b3752
copy
CSS Code
Go fullscreen
#ecfffb
copy
#b4f1f1
copy
#2d767f
copy
#1e6262
copy
CSS Code
Go fullscreen
#36413d
copy
#4c657e
copy
#f29696
copy
#ffe2ad
copy
CSS Code
Go fullscreen
#d0efb5
copy
#eb7878
copy
#2f3e75
copy
#f3e595
copy
CSS Code
Go fullscreen
#2c2955
copy
#4c5fb1
copy
#f9f194
copy
#cdd582
copy
CSS Code
Go fullscreen
#e42c64
copy
#614ad3
copy
#2d248a
copy
#121b74
copy
CSS Code
Go fullscreen
#ff5ab0
copy
#f7fed4
copy
#4df4ff
copy
#1bb5ec
copy
CSS Code
Go fullscreen
#233142
copy
#455d7a
copy
#f95959
copy
#e3e3e3
copy
CSS Code
Go fullscreen
#fdf196
copy
#c5fcda
copy
#98e5ec
copy
#67bac6
copy
CSS Code
Go fullscreen
#95efce
copy
#2ea1d9
copy
#395ea6
copy
#3e467f
copy
CSS Code
Go fullscreen
#360982
copy
#b72a67
copy
#ff9797
copy
#fde8cb
copy
CSS Code
Go fullscreen
#5c4b77
copy
#6990e4
copy
#b145ad
copy
#f6a2d4
copy
CSS Code
Go fullscreen
#0c005a
copy
#bc2525
copy
#ff0000
copy
#eaeaea
copy
CSS Code
Go fullscreen
#e8ecf1
copy
#b5cfd8
copy
#7393a7
copy
#6c737e
copy
CSS Code
Go fullscreen
#ff8fe5
copy
#fbff64
copy
#76e3ff
copy
#7bc7fa
copy
CSS Code
Go fullscreen
#866ec7
copy
#8f71ff
copy
#82acff
copy
#b7fbff
copy
CSS Code
Go fullscreen
#eef2f5
copy
#ea168e
copy
#612570
copy
#1eafed
copy
CSS Code
Go fullscreen
#3d5a59
copy
#9aebdd
copy
#367db5
copy
#313e86
copy
CSS Code
Go fullscreen
#7fcbd7
copy
#857ebb
copy
#ca9dd7
copy
#facbd3
copy
CSS Code
Go fullscreen
#f0f08e
copy
#91ca62
copy
#478077
copy
#3a4874
copy
CSS Code
Go fullscreen
#abedd8
copy
#46cdcf
copy
#0081c6
copy
#48466d
copy
CSS Code
Go fullscreen
#d1d1d1
copy
#c8e8ed
copy
#f7fdb1
copy
#ded473
copy
CSS Code
Go fullscreen
#1b3c68
copy
#0074e4
copy
#00b8c0
copy
#e9ffb2
copy
CSS Code
Go fullscreen
#faee5a
copy
#e4fcf9
copy
#ace6f6
copy
#4b89ac
copy
CSS Code
Go fullscreen
#fafcd6
copy
#259f6c
copy
#1e6b7f
copy
#140303
copy
CSS Code
Go fullscreen
#f3f9fb
copy
#474f85
copy
#51e3d4
copy
#f3ecd3
copy
CSS Code
Go fullscreen
#cefff1
copy
#ace7ef
copy
#a6acec
copy
#a56cc1
copy
CSS Code
Go fullscreen
#ebfffa
copy
#c6fce5
copy
#6ef3d6
copy
#0dceda
copy
CSS Code
Go fullscreen
#293462
copy
#211a4c
copy
#f33535
copy
#a51c2d
copy
CSS Code
Go fullscreen
#f9fa9b
copy
#ff7777
copy
#ceecf0
copy
#f0f3f3
copy
CSS Code
Go fullscreen
#00204a
copy
#005792
copy
#00bbf0
copy
#fdb44b
copy
CSS Code
Go fullscreen
#2d5c7f
copy
#fff1a8
copy
#ff8f56
copy
#984a59
copy
CSS Code
Go fullscreen
#6fe7dd
copy
#3490de
copy
#6639a6
copy
#521262
copy
CSS Code
Go fullscreen
#d9f9f4
copy
#9cd9de
copy
#86c1d4
copy
#5a92af
copy
CSS Code
Go fullscreen
#48829e
copy
#51dacf
copy
#9ef5cf
copy
#e8ffb1
copy
CSS Code
Go fullscreen
#f8ed86
copy
#a5e9db
copy
#2ca4bf
copy
#415b90
copy
CSS Code
Go fullscreen
#d3f6f3
copy
#f9fce1
copy
#fee9b2
copy
#fbd1b7
copy
CSS Code
Go fullscreen
#a3f7bf
copy
#29a19c
copy
#4b6289
copy
#60316e
copy
CSS Code
Go fullscreen
#ffdd93
copy
#58dada
copy
#1ca2bb
copy
#005e7c
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.