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
#a6f2db
copy
#7bcace
copy
#678eb4
copy
#4f4e79
copy
CSS Code
Go fullscreen
#f38181
copy
#fce38a
copy
#d6f7ad
copy
#95e1d3
copy
CSS Code
Go fullscreen
#413c69
copy
#4a47a3
copy
#ad62aa
copy
#eab9c9
copy
CSS Code
Go fullscreen
#4e4e6a
copy
#1f6cb0
copy
#70a3c4
copy
#e7e8f5
copy
CSS Code
Go fullscreen
#f0f08e
copy
#91ca62
copy
#478077
copy
#3a4874
copy
CSS Code
Go fullscreen
#ffabe5
copy
#c7f5ff
copy
#d89fff
copy
#f6fcae
copy
CSS Code
Go fullscreen
#f1e58a
copy
#4c5374
copy
#71647c
copy
#d0f0f7
copy
CSS Code
Go fullscreen
#90aeff
copy
#cefc86
copy
#60efb8
copy
#f9f7f7
copy
CSS Code
Go fullscreen
#423737
copy
#5d5d5d
copy
#00adb5
copy
#a3f7bf
copy
CSS Code
Go fullscreen
#c1f880
copy
#55c59d
copy
#4f5aa8
copy
#7481cf
copy
CSS Code
Go fullscreen
#f96d6d
copy
#b84d69
copy
#a9d7f6
copy
#8fb1e9
copy
CSS Code
Go fullscreen
#effffb
copy
#50d890
copy
#4f98ca
copy
#272727
copy
CSS Code
Go fullscreen
#804d3b
copy
#522e24
copy
#75beda
copy
#9aedf4
copy
CSS Code
Go fullscreen
#fce38a
copy
#0e5f76
copy
#083d56
copy
#0c2233
copy
CSS Code
Go fullscreen
#d7df71
copy
#0e5f76
copy
#083d56
copy
#081e3f
copy
CSS Code
Go fullscreen
#062743
copy
#113a5d
copy
#c4ffdd
copy
#f9f9f9
copy
CSS Code
Go fullscreen
#ffedc6
copy
#cdeeaa
copy
#96dae4
copy
#6d70c6
copy
CSS Code
Go fullscreen
#3c415e
copy
#738598
copy
#dfe2e2
copy
#1cb3c8
copy
CSS Code
Go fullscreen
#001f3f
copy
#083358
copy
#0d63a5
copy
#ffd717
copy
CSS Code
Go fullscreen
#231a31
copy
#e42f45
copy
#b42b3f
copy
#8ab2ff
copy
CSS Code
Go fullscreen
#1b3c68
copy
#0074e4
copy
#00b8c0
copy
#e9ffb2
copy
CSS Code
Go fullscreen
#211572
copy
#24bddf
copy
#f4f4f4
copy
#fffdbb
copy
CSS Code
Go fullscreen
#bdf9f7
copy
#93c4ff
copy
#b67ccf
copy
#765a60
copy
CSS Code
Go fullscreen
#f4f7ed
copy
#86ee60
copy
#2e6e65
copy
#2b3752
copy
CSS Code
Go fullscreen
#006c9a
copy
#00bebe
copy
#00f3e4
copy
#9ff9c1
copy
CSS Code
Go fullscreen
#f5f7fa
copy
#5be7c4
copy
#4fc1e9
copy
#7a57d1
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
#ff8fe5
copy
#fbff64
copy
#76e3ff
copy
#7bc7fa
copy
CSS Code
Go fullscreen
#ffe495
copy
#ffc97b
copy
#44558f
copy
#e6f7f7
copy
CSS Code
Go fullscreen
#1a2c5b
copy
#3e4e88
copy
#7971ea
copy
#b8dff0
copy
CSS Code
Go fullscreen
#ff9393
copy
#ff6767
copy
#ff3434
copy
#0c317a
copy
CSS Code
Go fullscreen
#1b3c59
copy
#456173
copy
#a6ed8e
copy
#f2f2f0
copy
CSS Code
Go fullscreen
#160f30
copy
#241663
copy
#a72693
copy
#eae7af
copy
CSS Code
Go fullscreen
#fff395
copy
#7459dc
copy
#41b3ff
copy
#63f5ef
copy
CSS Code
Go fullscreen
#152744
copy
#367591
copy
#61d2b4
copy
#9dfdc7
copy
CSS Code
Go fullscreen
#c7f5fe
copy
#fcc8f8
copy
#eab4f8
copy
#f3f798
copy
CSS Code
Go fullscreen
#010038
copy
#293a80
copy
#537ec5
copy
#f39422
copy
CSS Code
Go fullscreen
#8ecccc
copy
#50717b
copy
#3a4042
copy
#212121
copy
CSS Code
Go fullscreen
#a9eee6
copy
#fefaec
copy
#f38181
copy
#625772
copy
CSS Code
Go fullscreen
#002c6a
copy
#e45171
copy
#f8a79b
copy
#f8d99b
copy
CSS Code
Go fullscreen
#8be3e1
copy
#d3f7ad
copy
#95bb76
copy
#97935c
copy
CSS Code
Go fullscreen
#090089
copy
#0060ca
copy
#91ceff
copy
#fcdc74
copy
CSS Code
Go fullscreen
#d5fdff
copy
#9de5ff
copy
#aca8ff
copy
#ac73ff
copy
CSS Code
Go fullscreen
#183661
copy
#1c4b82
copy
#dd6b4d
copy
#dae1e7
copy
CSS Code
Go fullscreen
#f4f787
copy
#85eb4e
copy
#32c38c
copy
#3f84ac
copy
CSS Code
Go fullscreen
#ffebbc
copy
#5da7ae
copy
#543d46
copy
#292830
copy
CSS Code
Go fullscreen
#b0e6ff
copy
#7687db
copy
#8f45a9
copy
#582e48
copy
CSS Code
Go fullscreen
#2e94b9
copy
#fffdc1
copy
#f0b775
copy
#fd5959
copy
CSS Code
Go fullscreen
#f9fcfd
copy
#c9eff9
copy
#07a4b5
copy
#fed8a7
copy
CSS Code
Go fullscreen
#9effa9
copy
#36485e
copy
#333146
copy
#29252c
copy
CSS Code
Go fullscreen
#a3a7e4
copy
#bae2be
copy
#f0f1b3
copy
#c5e5e3
copy
CSS Code
Go fullscreen
#fcefed
copy
#6173f4
copy
#3b2e40
copy
#f35e3e
copy
CSS Code
Go fullscreen
#abf2fb
copy
#b589ef
copy
#a964cd
copy
#f1a3c5
copy
CSS Code
Go fullscreen
#ff5200
copy
#003355
copy
#04536c
copy
#adaca7
copy
CSS Code
Go fullscreen
#7b3c3c
copy
#db5f29
copy
#f0f0e4
copy
#68bde1
copy
CSS Code
Go fullscreen
#ececec
copy
#9fd3c7
copy
#385170
copy
#142d4c
copy
CSS Code
Go fullscreen
#3ec1d3
copy
#f6f7d7
copy
#ff9a00
copy
#ff165d
copy
CSS Code
Go fullscreen
#f35f5f
copy
#cc435f
copy
#f1ea65
copy
#36a3eb
copy
CSS Code
Go fullscreen
#ffcfdf
copy
#fefdca
copy
#e0f9b5
copy
#a5dee5
copy
CSS Code
Go fullscreen
#e9007f
copy
#7cdfff
copy
#d5fffb
copy
#fcffc8
copy
CSS Code
Go fullscreen
#c8f0f0
copy
#86d8dc
copy
#7047a3
copy
#3a276a
copy
CSS Code
Go fullscreen
#21243d
copy
#ff7c7c
copy
#ffd082
copy
#88e1f2
copy
CSS Code
Go fullscreen
#07689f
copy
#a2d5f2
copy
#fafafa
copy
#ff7e67
copy
CSS Code
Go fullscreen
#022c43
copy
#053f5e
copy
#115173
copy
#ffd700
copy
CSS Code
Go fullscreen
#f4f4ec
copy
#76e2f4
copy
#615dec
copy
#301781
copy
CSS Code
Go fullscreen
#634258
copy
#6d6087
copy
#60a0b0
copy
#9ad1aa
copy
CSS Code
Go fullscreen
#08085e
copy
#a2ef44
copy
#fff07a
copy
#e8fcf6
copy
CSS Code
Go fullscreen
#f3d1f4
copy
#f5fcc1
copy
#bae5e5
copy
#98d6ea
copy
CSS Code
Go fullscreen
#e6f8f9
copy
#b1e8ed
copy
#edb5f5
copy
#e86ed0
copy
CSS Code
Go fullscreen
#3a0088
copy
#930077
copy
#e61c5d
copy
#ffbd39
copy
CSS Code
Go fullscreen
#f9c4ac
copy
#626f92
copy
#474168
copy
#272637
copy
CSS Code
Go fullscreen
#eda1c1
copy
#fab2ac
copy
#bee4d2
copy
#d7f8f7
copy
CSS Code
Go fullscreen
#0e2e3b
copy
#166678
copy
#7db9b3
copy
#d8d7c3
copy
CSS Code
Go fullscreen
#beeef7
copy
#6fc2d0
copy
#373a6d
copy
#ff8246
copy
CSS Code
Go fullscreen
#14103b
copy
#f02a71
copy
#7ec0e4
copy
#6789ba
copy
CSS Code
Go fullscreen
#225763
copy
#41d8bf
copy
#2f89b3
copy
#3b50b2
copy
CSS Code
Go fullscreen
#516091
copy
#74bec1
copy
#adebbe
copy
#eef3ad
copy
CSS Code
Go fullscreen
#e7e6e1
copy
#f7f6e7
copy
#c1c0b9
copy
#537791
copy
CSS Code
Go fullscreen
#f7f5b2
copy
#bad4f9
copy
#5e89ef
copy
#352771
copy
CSS Code
Go fullscreen
#616eef
copy
#09a8fa
copy
#41c5d3
copy
#d0f1cf
copy
CSS Code
Go fullscreen
#002bdc
copy
#2f4bff
copy
#00a6e7
copy
#ffe37f
copy
CSS Code
Go fullscreen
#ffdaa9
copy
#6fa3a9
copy
#5f72b2
copy
#60366f
copy
CSS Code
Go fullscreen
#48829e
copy
#51dacf
copy
#9ef5cf
copy
#e8ffb1
copy
CSS Code
Go fullscreen
#ff9090
copy
#ffcf7f
copy
#fffa62
copy
#89c4ff
copy
CSS Code
Go fullscreen
#2f2342
copy
#e42f45
copy
#b42b3f
copy
#7ca0e5
copy
CSS Code
Go fullscreen
#272e6e
copy
#ffffc3
copy
#ffc55c
copy
#e95d35
copy
CSS Code
Go fullscreen
#e8e8e8
copy
#5588a3
copy
#145374
copy
#00334e
copy
CSS Code
Go fullscreen
#ff7676
copy
#f6f49d
copy
#5dae8b
copy
#466c95
copy
CSS Code
Go fullscreen
#b9f9ff
copy
#dafdff
copy
#f7e590
copy
#f5cd6d
copy
CSS Code
Go fullscreen
#e67676
copy
#f2f062
copy
#a9e6e6
copy
#7692e4
copy
CSS Code
Go fullscreen
#071e3d
copy
#1f4287
copy
#278ea5
copy
#21e6c1
copy
CSS Code
Go fullscreen
#f39de5
copy
#9b77da
copy
#4e6b9f
copy
#6fa5b1
copy
CSS Code
Go fullscreen
#2c2955
copy
#4c5fb1
copy
#f9f194
copy
#cdd582
copy
CSS Code
Go fullscreen
#1b262c
copy
#0f4c81
copy
#ed6663
copy
#ffa372
copy
CSS Code
Go fullscreen
#233142
copy
#455d7a
copy
#f95959
copy
#e3e3e3
copy
CSS Code
Go fullscreen
#083c5a
copy
#4cb648
copy
#fcc72c
copy
#e4f4fd
copy
CSS Code
Go fullscreen
#92e6e6
copy
#fff9af
copy
#d65d7a
copy
#524c84
copy
CSS Code
Go fullscreen
#83e4b5
copy
#3ec8ac
copy
#4e90a4
copy
#6e60a0
copy
CSS Code
Go fullscreen
#f7f7f7
copy
#fcd59b
copy
#1fa8cf
copy
#2657c1
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.