Design tohoto webu jsem proměnila do následující palety barev vygenerované pomocí W3.CSS Color Themes. Za základní barvu jsem zvolila #888844. Základní barva byla vybrána pomocí Color Pickeru.
Khaki #888844, hsl(60, 33%, 40%) + opozitní o 180°
| Khaki #888844, hsl(60, 33%, 40%) | Modrá opozitní #444488, hsl(240, 33%, 40%) |
|---|---|
#f9f9f3 w3-theme-l5 |
#f3f3f9 w3-theme-l5 |
#eaead6 w3-theme-l4 |
#d6d6ea w3-theme-l4 |
#d6d6ae w3-theme-l3 |
#aeaed6 w3-theme-l3 |
#c1c185 w3-theme-l2 |
#8585c1 w3-theme-l2 |
#adad5c w3-theme-l1 |
#5c5cad w3-theme-l1 |
#888844 w3-theme |
#444488 w3-theme |
#7a7a3e w3-theme-d1 |
#3e3e7a w3-theme-d1 |
#6d6d37 w3-theme-d2 |
#37376d w3-theme-d2 |
#5f5f30 w3-theme-d3 |
#30305f w3-theme-d3 |
#515129 w3-theme-d4 |
#292951 w3-theme-d4 |
#444422 w3-theme-d5 |
#222244 w3-theme-d5 |
Vygenerované CSS #888844
.w3-theme-l5 {color:#000 !important; background-color:#f9f9f3 !important}
.w3-theme-l4 {color:#000 !important; background-color:#eaead6 !important}
.w3-theme-l3 {color:#000 !important; background-color:#d6d6ae !important}
.w3-theme-l2 {color:#000 !important; background-color:#c1c185 !important}
.w3-theme-l1 {color:#fff !important; background-color:#adad5c !important}
.w3-theme-d1 {color:#fff !important; background-color:#7a7a3e !important}
.w3-theme-d2 {color:#fff !important; background-color:#6d6d37 !important}
.w3-theme-d3 {color:#fff !important; background-color:#5f5f30 !important}
.w3-theme-d4 {color:#fff !important; background-color:#515129 !important}
.w3-theme-d5 {color:#fff !important; background-color:#444422 !important}
.w3-theme-light {color:#000 !important; background-color:#f9f9f3 !important}
.w3-theme-dark {color:#fff !important; background-color:#444422 !important}
.w3-theme-action {color:#fff !important; background-color:#444422 !important}
.w3-theme {color:#fff !important; background-color:#888844 !important}
.w3-text-theme {color:#888844 !important}
.w3-theme-border {border-color:#888844 !important}
.w3-hover-theme:hover {color:#fff !important; background-color:#888844 !important}
Vygenerované CSS #444488
.w3-theme-l5 {color:#000 !important; background-color:#f3f3f9 !important}
.w3-theme-l4 {color:#000 !important; background-color:#d6d6ea !important}
.w3-theme-l3 {color:#000 !important; background-color:#aeaed6 !important}
.w3-theme-l2 {color:#fff !important; background-color:#8585c1 !important}
.w3-theme-l1 {color:#fff !important; background-color:#5c5cad !important}
.w3-theme-d1 {color:#fff !important; background-color:#3e3e7a !important}
.w3-theme-d2 {color:#fff !important; background-color:#37376d !important}
.w3-theme-d3 {color:#fff !important; background-color:#30305f !important}
.w3-theme-d4 {color:#fff !important; background-color:#292951 !important}
.w3-theme-d5 {color:#fff !important; background-color:#222244 !important}
.w3-theme-light {color:#000 !important; background-color:#f3f3f9 !important}
.w3-theme-dark {color:#fff !important; background-color:#222244 !important}
.w3-theme-action {color:#fff !important; background-color:#222244 !important}
.w3-theme {color:#fff !important; background-color:#444488 !important}
.w3-text-theme {color:#444488 !important}
.w3-theme-border {border-color:#444488 !important}
.w3-hover-theme:hover {color:#fff !important; background-color:#444488 !important}