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
#e9fadd
copy
#b8e4c9
copy
#3f5468
copy
#42291c
copy
CSS Code
Go fullscreen
#21243d
copy
#ff7c7c
copy
#ffd082
copy
#88e1f2
copy
CSS Code
Go fullscreen
#b7fbff
copy
#fff6be
copy
#ffe0a3
copy
#ffa1ac
copy
CSS Code
Go fullscreen
#303841
copy
#47555e
copy
#7aa5d2
copy
#eeeeee
copy
CSS Code
Go fullscreen
#f2ff9b
copy
#6af79a
copy
#57acc5
copy
#444b6c
copy
CSS Code
Go fullscreen
#9effa9
copy
#36485e
copy
#333146
copy
#29252c
copy
CSS Code
Go fullscreen
#324e7b
copy
#86a6df
copy
#5068a9
copy
#f8f8f8
copy
CSS Code
Go fullscreen
#ebd9dd
copy
#d8aed3
copy
#9182c4
copy
#486989
copy
CSS Code
Go fullscreen
#062743
copy
#113a5d
copy
#ff7a8a
copy
#f9f9f9
copy
CSS Code
Go fullscreen
#defcf9
copy
#cadefc
copy
#c3bef0
copy
#cca8e9
copy
CSS Code
Go fullscreen
#090088
copy
#930077
copy
#e4007c
copy
#ffbd39
copy
CSS Code
Go fullscreen
#effffb
copy
#50d890
copy
#4f98ca
copy
#272727
copy
CSS Code
Go fullscreen
#abf2fb
copy
#b589ef
copy
#a964cd
copy
#f1a3c5
copy
CSS Code
Go fullscreen
#e3c4a8
copy
#4592af
copy
#226089
copy
#000000
copy
CSS Code
Go fullscreen
#a3f3eb
copy
#f1ffab
copy
#fbd341
copy
#fb9a40
copy
CSS Code
Go fullscreen
#062743
copy
#113a5d
copy
#c4ffdd
copy
#f9f9f9
copy
CSS Code
Go fullscreen
#b8f7d4
copy
#6fe7db
copy
#7fa6ee
copy
#835af1
copy
CSS Code
Go fullscreen
#f1fafb
copy
#a0e4f1
copy
#9dc6ff
copy
#4993fa
copy
CSS Code
Go fullscreen
#020438
copy
#284184
copy
#1f8ea3
copy
#00eaff
copy
CSS Code
Go fullscreen
#08085e
copy
#a2ef44
copy
#fff07a
copy
#e8fcf6
copy
CSS Code
Go fullscreen
#04879c
copy
#0c3c78
copy
#090030
copy
#f30a49
copy
CSS Code
Go fullscreen
#c84361
copy
#e78775
copy
#abcdcb
copy
#ebe59b
copy
CSS Code
Go fullscreen
#fffac0
copy
#ffd79a
copy
#73b9d7
copy
#9de6e8
copy
CSS Code
Go fullscreen
#ebfffa
copy
#c6fce5
copy
#6ef3d6
copy
#0dceda
copy
CSS Code
Go fullscreen
#1b5a7a
copy
#1aa59a
copy
#a6ed8e
copy
#f3ffb9
copy
CSS Code
Go fullscreen
#fcfcfc
copy
#0fc9e7
copy
#3186b2
copy
#4756ca
copy
CSS Code
Go fullscreen
#f60c86
copy
#f9f6d8
copy
#a5bfdd
copy
#2e89ba
copy
CSS Code
Go fullscreen
#eeeeee
copy
#fcc314
copy
#94ac3c
copy
#295ba7
copy
CSS Code
Go fullscreen
#1b3c68
copy
#0074e4
copy
#00b8c0
copy
#e9ffb2
copy
CSS Code
Go fullscreen
#6bd5e1
copy
#ffd98e
copy
#ffb677
copy
#ff8364
copy
CSS Code
Go fullscreen
#f9f9f9
copy
#ded5c4
copy
#ef7e56
copy
#305973
copy
CSS Code
Go fullscreen
#b590ca
copy
#a8d3da
copy
#f5cab3
copy
#f3ecb8
copy
CSS Code
Go fullscreen
#002bdc
copy
#2f4bff
copy
#00a6e7
copy
#ffe37f
copy
CSS Code
Go fullscreen
#00334e
copy
#145374
copy
#5588a3
copy
#e8e8e8
copy
CSS Code
Go fullscreen
#6c5ce7
copy
#7b88ff
copy
#fdcb6e
copy
#fff3b1
copy
CSS Code
Go fullscreen
#0000ff
copy
#6a5acd
copy
#add8e6
copy
#e6e6fa
copy
CSS Code
Go fullscreen
#f2f2f0
copy
#ff5e3a
copy
#2c365d
copy
#272e4f
copy
CSS Code
Go fullscreen
#a1eafb
copy
#fdfdfd
copy
#ffcef3
copy
#cabbe9
copy
CSS Code
Go fullscreen
#e9f679
copy
#9bdf46
copy
#25a55f
copy
#346473
copy
CSS Code
Go fullscreen
#fcefee
copy
#fccde2
copy
#fc5c9c
copy
#c5e3f6
copy
CSS Code
Go fullscreen
#f4f56e
copy
#72e8e1
copy
#58b3d3
copy
#418c9f
copy
CSS Code
Go fullscreen
#dffcad
copy
#6ec189
copy
#595cae
copy
#424478
copy
CSS Code
Go fullscreen
#900c3f
copy
#c70039
copy
#ff5733
copy
#ffc300
copy
CSS Code
Go fullscreen
#ffd1bd
copy
#ffb0cd
copy
#ffffff
copy
#c2f0fc
copy
CSS Code
Go fullscreen
#8aacff
copy
#626fe6
copy
#6d42c7
copy
#e85b48
copy
CSS Code
Go fullscreen
#010038
copy
#293a80
copy
#537ec5
copy
#f39422
copy
CSS Code
Go fullscreen
#272343
copy
#ffffff
copy
#e3f6f5
copy
#bae8e8
copy
CSS Code
Go fullscreen
#73f7dd
copy
#2cc4cb
copy
#1972a4
copy
#2e3a87
copy
CSS Code
Go fullscreen
#f0f08e
copy
#91ca62
copy
#478077
copy
#3a4874
copy
CSS Code
Go fullscreen
#a9eee6
copy
#fefaec
copy
#f38181
copy
#625772
copy
CSS Code
Go fullscreen
#ffdede
copy
#f7f3ce
copy
#c5ecbe
copy
#4797b1
copy
CSS Code
Go fullscreen
#e9e6c9
copy
#ca6144
copy
#566683
copy
#393e51
copy
CSS Code
Go fullscreen
#111f4d
copy
#f2f4f7
copy
#e43a19
copy
#020205
copy
CSS Code
Go fullscreen
#35477d
copy
#6c5b7b
copy
#c06c84
copy
#f67280
copy
CSS Code
Go fullscreen
#1d2b53
copy
#7e2553
copy
#ff004d
copy
#fff024
copy
CSS Code
Go fullscreen
#360982
copy
#b72a67
copy
#ff9797
copy
#fde8cb
copy
CSS Code
Go fullscreen
#211572
copy
#48c0d3
copy
#dedede
copy
#ffe578
copy
CSS Code
Go fullscreen
#404b69
copy
#283149
copy
#f73859
copy
#f3ecc8
copy
CSS Code
Go fullscreen
#99e1e5
copy
#f3e8cb
copy
#f2c6b4
copy
#fbafaf
copy
CSS Code
Go fullscreen
#5585b5
copy
#53a8b6
copy
#79c2d0
copy
#bbe4e9
copy
CSS Code
Go fullscreen
#f7f7f7
copy
#fcd59b
copy
#1fa8cf
copy
#2657c1
copy
CSS Code
Go fullscreen
#a3f7bf
copy
#29a19c
copy
#4b6289
copy
#60316e
copy
CSS Code
Go fullscreen
#282d4f
copy
#23103a
copy
#a0204c
copy
#ff6c00
copy
CSS Code
Go fullscreen
#efff9d
copy
#2aa9d2
copy
#1874c3
copy
#2931b3
copy
CSS Code
Go fullscreen
#bad7df
copy
#ffe2e2
copy
#f6f6f6
copy
#99ddcc
copy
CSS Code
Go fullscreen
#011f3f
copy
#0960bd
copy
#429ffd
copy
#fef2bf
copy
CSS Code
Go fullscreen
#f8ed86
copy
#a5e9db
copy
#2ca4bf
copy
#415b90
copy
CSS Code
Go fullscreen
#1b3764
copy
#4ab8b8
copy
#fafccb
copy
#efa35c
copy
CSS Code
Go fullscreen
#ecfeff
copy
#00b7c2
copy
#128494
copy
#4ef037
copy
CSS Code
Go fullscreen
#a8d8ea
copy
#aa96da
copy
#fcbad3
copy
#ffffd2
copy
CSS Code
Go fullscreen
#415f77
copy
#d1e9ea
copy
#fc5050
copy
#ffd00c
copy
CSS Code
Go fullscreen
#ff008e
copy
#124e96
copy
#0d8abc
copy
#daeaf6
copy
CSS Code
Go fullscreen
#0962ea
copy
#0e7cf4
copy
#0aa0f6
copy
#faf15d
copy
CSS Code
Go fullscreen
#4d089a
copy
#323edd
copy
#dc2ade
copy
#e8f044
copy
CSS Code
Go fullscreen
#2c2955
copy
#4c5fb1
copy
#f9f194
copy
#cdd582
copy
CSS Code
Go fullscreen
#155674
copy
#60beb3
copy
#79f8bb
copy
#f5ffae
copy
CSS Code
Go fullscreen
#2794eb
copy
#bff8d4
copy
#47d6b6
copy
#17b3c1
copy
CSS Code
Go fullscreen
#6b76ff
copy
#a5aeff
copy
#c8e4fe
copy
#feffe0
copy
CSS Code
Go fullscreen
#ecf0f1
copy
#33cccc
copy
#2980b9
copy
#2c3e50
copy
CSS Code
Go fullscreen
#d3f4ff
copy
#b2dffb
copy
#e7a4e4
copy
#ffc55c
copy
CSS Code
Go fullscreen
#b3f7f6
copy
#7dd076
copy
#f1f592
copy
#f4cb81
copy
CSS Code
Go fullscreen
#b6e1e0
copy
#9cd3d3
copy
#e8630a
copy
#2b4353
copy
CSS Code
Go fullscreen
#e1f2fb
copy
#f1f9f9
copy
#f3dfe3
copy
#e9b2bc
copy
CSS Code
Go fullscreen
#f2f7ff
copy
#0b409c
copy
#10316b
copy
#ffe867
copy
CSS Code
Go fullscreen
#fffcea
copy
#a5f2e7
copy
#8983f3
copy
#3a0077
copy
CSS Code
Go fullscreen
#2a1a5e
copy
#f45905
copy
#fb9224
copy
#fbe555
copy
CSS Code
Go fullscreen
#27296d
copy
#5e63b6
copy
#a393eb
copy
#f5c7f7
copy
CSS Code
Go fullscreen
#146c78
copy
#0e91a1
copy
#7dce94
copy
#efede7
copy
CSS Code
Go fullscreen
#2d095c
copy
#20366b
copy
#dd7777
copy
#eae3e3
copy
CSS Code
Go fullscreen
#364968
copy
#fddf97
copy
#e09664
copy
#6c4343
copy
CSS Code
Go fullscreen
#232855
copy
#215b63
copy
#5fcc9c
copy
#aaffc7
copy
CSS Code
Go fullscreen
#4cb3cd
copy
#52d6d3
copy
#5968b1
copy
#302579
copy
CSS Code
Go fullscreen
#bff4ed
copy
#280f34
copy
#e41655
copy
#b30753
copy
CSS Code
Go fullscreen
#083c5a
copy
#4cb648
copy
#fcc72c
copy
#e4f4fd
copy
CSS Code
Go fullscreen
#39627f
copy
#4b788f
copy
#e4de66
copy
#beb000
copy
CSS Code
Go fullscreen
#005689
copy
#007cb9
copy
#f6c667
copy
#f1f8fd
copy
CSS Code
Go fullscreen
#106ee8
copy
#0fc1a1
copy
#90e0ab
copy
#cbffce
copy
CSS Code
Go fullscreen
#fcf798
copy
#e0fff9
copy
#74d2ff
copy
#5ca4ca
copy
CSS Code
Go fullscreen
#e0f6aa
copy
#69aeff
copy
#9d4dff
copy
#6b3278
copy
CSS Code
Go fullscreen
#5f5dbd
copy
#5e87b8
copy
#83cee0
copy
#a4fbe3
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.