├── swatches ├── swatches-theNewDefault-colors-names.ai ├── swatches-theNewDefault-colors-names.ase └── swatches-theNewDefault-colors-names.clr ├── sass ├── functions │ └── _color-generator.scss ├── main.scss └── maps │ └── _color-map.scss ├── .gitignore ├── README.md ├── css └── main.css └── palette.html /swatches/swatches-theNewDefault-colors-names.ai: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dudleystorey/thenewdefaults/HEAD/swatches/swatches-theNewDefault-colors-names.ai -------------------------------------------------------------------------------- /swatches/swatches-theNewDefault-colors-names.ase: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dudleystorey/thenewdefaults/HEAD/swatches/swatches-theNewDefault-colors-names.ase -------------------------------------------------------------------------------- /swatches/swatches-theNewDefault-colors-names.clr: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dudleystorey/thenewdefaults/HEAD/swatches/swatches-theNewDefault-colors-names.clr -------------------------------------------------------------------------------- /sass/functions/_color-generator.scss: -------------------------------------------------------------------------------- 1 | @function color($key) { 2 | @if map-has-key($colors, $key) { 3 | @return map-get($colors, $key) 4 | } 5 | @warn "Unknown #{key} in $colors."; 6 | @return null; 7 | } -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Created by https://www.gitignore.io 2 | 3 | ### OSX ### 4 | .DS_Store 5 | .AppleDouble 6 | .LSOverride 7 | 8 | # Icon must end with two \r 9 | Icon 10 | 11 | 12 | # Thumbnails 13 | ._* 14 | 15 | # Files that might appear on external disk 16 | .Spotlight-V100 17 | .Trashes 18 | 19 | # Directories potentially created on remote AFP share 20 | .AppleDB 21 | .AppleDesktop 22 | Network Trash Folder 23 | Temporary Items 24 | .apdisk 25 | 26 | #Codekit / Sass caches 27 | .sass-cache -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | The New Defaults: A Sass Color Thesaurus 2 | ======================================== 3 | 4 | A Sass replacement for the standard CSS named color system. Provides more visually appealing hues for many CSS keywords; adds new colors with more relevant and easily remembered names. Inspired by [Ingrid Sundberg’s color thesaurus](http://ingridsnotes.wordpress.com/2014/02/04/the-color-thesaurus/) and the work of [Adam Morse](http://clrs.cc/). 5 | 6 | To use 7 | ------ 8 | 9 | Include `_color-map.scss` and `_color-generator.scss` in your project: 10 | 11 | ```CSS 12 | @import 'maps/_color-map.scss'; 13 | @import 'functions/_color-generator.scss'; 14 | ``` 15 | 16 | Use any of the named colors in your Sass: 17 | 18 | ```CSS 19 | body { background: color(sky); } 20 | ``` 21 | 22 | A [complete visual guide to The New Defaults](http://dudleystorey.github.io/thenewdefaults/) is available on Github Pages. 23 | -------------------------------------------------------------------------------- /sass/main.scss: -------------------------------------------------------------------------------- 1 | @import 'maps/_color-map.scss'; 2 | @import 'functions/_color-generator.scss'; 3 | 4 | @font-face { 5 | font-family: 'Source Serif Pro'; 6 | src: local('SourceSerifPro-Regular'); 7 | src: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/4273/SourceSerifPro-Regular.eot'); 8 | src: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/4273/SourceSerifPro-Regular.otf') format('opentype'), 9 | url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/4273/SourceSerifPro-Regular.woff') format('woff'); 10 | font-style: normal; 11 | font-weight: 400; 12 | } 13 | @font-face { 14 | font-family: 'Source Code Pro ExtraLight'; 15 | src: local('Source Code Pro ExtraLight'); 16 | src: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/4273/SourceCodePro-ExtraLight.eot'); 17 | src: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/4273/SourceCodePro-ExtraLight.otf') format('opentype'), 18 | url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/4273/SourceCodePro-ExtraLight.woff') format('woff'); 19 | font-style: normal; 20 | font-weight: 200; 21 | } 22 | 23 | * { box-sizing: border-box; } 24 | body { 25 | font-family: Source Serif Pro; 26 | font-weight: 100; 27 | font-size: 0; 28 | margin: 0; 29 | } 30 | 31 | h2 { font-size: 2rem; color: #000; text-align: center; line-height: 2;} 32 | .colors { 33 | display: flex; 34 | flex-flow: row wrap; 35 | color: black; 36 | margin: 4rem 0; 37 | } 38 | .colors > div { 39 | font-size: 1.8rem; 40 | padding: .8em; 41 | text-align: center; 42 | font-weight: 100; 43 | flex: 1; 44 | min-width: 12rem; 45 | } 46 | 47 | .colors span { 48 | display: block; 49 | font-family: Source Code Pro; 50 | font-size: 1.2rem; 51 | margin-top: .4rem; 52 | } 53 | .whitetext { color: color(white); } 54 | .blacktext { color: color(black); } 55 | 56 | @each $color, $value in $colors { 57 | .#{"" + $color} { 58 | background: $value; 59 | } 60 | } 61 | 62 | -------------------------------------------------------------------------------- /sass/maps/_color-map.scss: -------------------------------------------------------------------------------- 1 | $colors: ( 2 | 3 | // whites 4 | 5 | white: #fffefc, 6 | pearl: #fbfcf7, 7 | alabaster: #fefaf0, 8 | snow: #f4fefd, 9 | ivory: #fef7e5, 10 | cream: #fffbda, 11 | eggshell: #fef9e3, 12 | cotton: #fbfcf7, 13 | chiffon: #fafaf1, 14 | salt: #f8efec, 15 | lace: #faf3ea, 16 | coconut: #fff1e6, 17 | linen: #f2ebd3, 18 | bone: #e7dfcc, 19 | porcelain: #fffffc, 20 | parchment: #fcf6df, 21 | rice: #fbf6ef, 22 | 23 | // blues 24 | 25 | blue: #0074d9, 26 | navy: #001f3f, 27 | aqua: #7fdbff, 28 | sky: #00b2ff, 29 | teal: #39cccc, 30 | slate: #757b87, 31 | indigo: #281e5d, 32 | cobalt: #1438bd, 33 | ocean: #026063, 34 | peacock: #002d37, 35 | azure: #1621a6, 36 | cerulean: #0592c2, 37 | lapis: #2632c2, 38 | spruce: #2c3e4b, 39 | stone: #59788d, 40 | aegean: #1e456e, 41 | berry: #24146f, 42 | denim: #141e3c, 43 | admiral: #061094, 44 | sapphire: #52b2c0, 45 | arctic: #82edfd, 46 | 47 | // browns 48 | 49 | tan: #e5dbac, 50 | beige: #ecdc99, 51 | macaroon: #f7df75, 52 | hazelwood: #c9bc8e, 53 | granola: #d6b75a, 54 | oat: #dec98a, 55 | eggnog: #fbe29d, 56 | fawn: #c7a951, 57 | sugarcookie: #f3ebad, 58 | sand: #d7b963, 59 | sepia: #e3b678, 60 | latte: #e9c17b, 61 | oyster: #dcd69f, 62 | biscotti: #e3c565, 63 | parmesean: #fee993, 64 | hazelnut: #bda55d, 65 | sandcastle: #dbc27d, 66 | buttermilk: #fdefb2, 67 | sanddollar: #ebe7b9, 68 | shortbread: #fce791, 69 | 70 | // yellows 71 | 72 | yellow: #ffdc00, 73 | canary: #fac801, 74 | gold: #f9a602, 75 | daffodil: #feee88, 76 | flaxen: #d5b65a, 77 | butter: #fee226, 78 | lemon: #effd5f, 79 | mustard: #e9b829, 80 | corn: #e4cd04, 81 | medallion: #e4b103, 82 | dandelion: #fdce2a, 83 | bumblebee: #fce206, 84 | banana: #fcf4a3, 85 | butterscotch: #fabd04, 86 | dijon: #c29200, 87 | honey: #ec9707, 88 | blonde: #fdeb75, 89 | pineapple: #ffe327, 90 | tuscansun: #fcd12a, 91 | 92 | // oranges 93 | 94 | orange: #ff851b, 95 | tangerine: #f98228, 96 | merigold: #fdae1d, 97 | cider: #b66827, 98 | rust: #8c4005, 99 | ginger: #bc5703, 100 | tiger: #fb6b02, 101 | bronze: #b2560c, 102 | cantaloupe: #fca172, 103 | apricot: #ed810f, 104 | carrot: #ed7116, 105 | squash: #c95c09, 106 | spice: #7a3a03, 107 | marmalade: #d16102, 108 | amber: #893201, 109 | sandstone: #d57128, 110 | yam: #cc5801, 111 | 112 | // reds 113 | 114 | red: #ff4136, 115 | cherry: #9a0f02, 116 | rose: #e2252a, 117 | jam: #600f0b, 118 | merlot: #541f1b, 119 | garnet: #5f0a04, 120 | crimson: #b8100a, 121 | ruby: #900503, 122 | scarlet: #910d08, 123 | redwine: #4c0805, 124 | redapple: #a91b0d, 125 | mahogany: #420d09, 126 | blood: #710c04, 127 | sangria: #5f1914, 128 | currant: #670c07, 129 | blush: #bb544a, 130 | candy: #d31603, 131 | lipstick: #9b0f02, 132 | 133 | // pinks 134 | 135 | pink: #f69acd, 136 | fuchsia: #f012be, 137 | punch: #f25278, 138 | watermelon: #fe809c, 139 | flamingo: #fda4b8, 140 | rouge: #f26c8c, 141 | salmon: #fdab9f, 142 | coral: #fe7d67, 143 | peach: #fb9483, 144 | strawberry: #fc4c4e, 145 | rosewood: #a04242, 146 | lemonade: #fabacb, 147 | taffy: #fa85c4, 148 | bubblegum: #fd5ca8, 149 | balletslipper: #f69abf, 150 | crepe: #f1b7c6, 151 | maroon: #85144b, 152 | hotpink: #ff1696, 153 | 154 | // purples 155 | 156 | purple: #b10dc9, 157 | mauve: #7a4a89, 158 | violet: #710193, 159 | boysenberry: #630536, 160 | lavender: #e3a0f6, 161 | plum: #601a36, 162 | lilac: #b65fcd, 163 | periwinkle: #be93d4, 164 | eggplant: #311431, 165 | iris: #9866c5, 166 | heather: #9b7cb9, 167 | amethyst: #a45de4, 168 | raisin: #290916, 169 | orchid: #af69ee, 170 | mulberry: #4d0220, 171 | 172 | // greens 173 | 174 | green: #2ecc40, 175 | chartreuse: #b0fd38, 176 | juniper: #395311, 177 | sage: #728c69, 178 | lime: #01ff70, 179 | fern: #5dbc64, 180 | olive: #98bf64, 181 | emerald: #038911, 182 | pear: #74b62d, 183 | moss: #476d1e, 184 | shamrock: #03ac13, 185 | seafoam: #3cec96, 186 | pine: #24501e, 187 | parakeet: #02c04a, 188 | mint: #98ecc3, 189 | seaweed: #354b21, 190 | pickle: #5a7d36, 191 | pistachio: #b2d3c1, 192 | basil: #32622d, 193 | crocodile: #5f7c3a, 194 | 195 | // browns 196 | 197 | brown: #241709, 198 | coffee: #4b371c, 199 | mocha: #3c290d, 200 | peanut: #795c34, 201 | carob: #35260f, 202 | hickory: #371d10, 203 | pecan: #4a2512, 204 | walnut: #432711, 205 | caramel: #66360f, 206 | gingerbread: #5d2c04, 207 | chocolate: #2c1603, 208 | tortilla: #9a7b4f, 209 | umber: #352415, 210 | tawny: #7e491d, 211 | brunette: #391e07, 212 | cinammon: #642b0d, 213 | penny: #522915, 214 | 215 | // greys 216 | 217 | grey: #aaaaaa, 218 | shadow: #373737, 219 | graphite: #584d5b, 220 | iron: #332d31, 221 | pewter: #6a6880, 222 | cloud: #c5c5d0, 223 | silver: #dddddd, 224 | smoke: #59515f, 225 | anchor: #42424c, 226 | ash: #554c4d, 227 | porpoise: #4d4c5c, 228 | dove: #7c6e7f, 229 | fog: #655965, 230 | flint: #7d7c9c, 231 | pebble: #333333, 232 | lead: #403f4e, 233 | coin: #9897a9, 234 | fossil: #787276, 235 | 236 | // blacks 237 | 238 | black: #111111, 239 | ebony: #080401, 240 | crow: #25221F, 241 | charcoal: #222023 242 | ); -------------------------------------------------------------------------------- /css/main.css: -------------------------------------------------------------------------------- 1 | @font-face { 2 | font-family: 'Source Serif Pro'; 3 | src: local("SourceSerifPro-Regular"); 4 | src: url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/4273/SourceSerifPro-Regular.eot"); 5 | src: url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/4273/SourceSerifPro-Regular.otf") format("opentype"), url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/4273/SourceSerifPro-Regular.woff") format("woff"); 6 | font-style: normal; 7 | font-weight: 400; } 8 | @font-face { 9 | font-family: 'Source Code Pro ExtraLight'; 10 | src: local("Source Code Pro ExtraLight"); 11 | src: url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/4273/SourceCodePro-ExtraLight.eot"); 12 | src: url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/4273/SourceCodePro-ExtraLight.otf") format("opentype"), url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/4273/SourceCodePro-ExtraLight.woff") format("woff"); 13 | font-style: normal; 14 | font-weight: 200; } 15 | * { 16 | -moz-box-sizing: border-box; 17 | box-sizing: border-box; } 18 | 19 | body { 20 | font-family: Source Serif Pro; 21 | font-weight: 100; 22 | font-size: 0; 23 | margin: 0; } 24 | 25 | h2 { 26 | font-size: 2rem; 27 | color: #000; 28 | text-align: center; 29 | line-height: 2; } 30 | 31 | .colors { 32 | display: -webkit-box; 33 | display: -webkit-flex; 34 | display: -ms-flexbox; 35 | display: flex; 36 | -webkit-flex-flow: row wrap; 37 | -ms-flex-flow: row wrap; 38 | flex-flow: row wrap; 39 | color: black; 40 | margin: 4rem 0; } 41 | 42 | .colors > div { 43 | font-size: 1.8rem; 44 | padding: .8em; 45 | text-align: center; 46 | font-weight: 100; 47 | -webkit-box-flex: 1; 48 | -webkit-flex: 1; 49 | -ms-flex: 1; 50 | flex: 1; 51 | min-width: 12rem; } 52 | 53 | .colors span { 54 | display: block; 55 | font-family: Source Code Pro; 56 | font-size: 1.2rem; 57 | margin-top: .4rem; } 58 | 59 | .whitetext { 60 | color: #fffefc; } 61 | 62 | .blacktext { 63 | color: #111111; } 64 | 65 | .white { 66 | background: #fffefc; } 67 | 68 | .pearl { 69 | background: #fbfcf7; } 70 | 71 | .alabaster { 72 | background: #fefaf0; } 73 | 74 | .snow { 75 | background: #f4fefd; } 76 | 77 | .ivory { 78 | background: #fef7e5; } 79 | 80 | .cream { 81 | background: #fffbda; } 82 | 83 | .eggshell { 84 | background: #fef9e3; } 85 | 86 | .cotton { 87 | background: #fbfcf7; } 88 | 89 | .chiffon { 90 | background: #fafaf1; } 91 | 92 | .salt { 93 | background: #f8efec; } 94 | 95 | .lace { 96 | background: #faf3ea; } 97 | 98 | .coconut { 99 | background: #fff1e6; } 100 | 101 | .linen { 102 | background: #f2ebd3; } 103 | 104 | .bone { 105 | background: #e7dfcc; } 106 | 107 | .porcelain { 108 | background: #fffffc; } 109 | 110 | .parchment { 111 | background: #fcf6df; } 112 | 113 | .rice { 114 | background: #fbf6ef; } 115 | 116 | .blue { 117 | background: #0074d9; } 118 | 119 | .navy { 120 | background: #001f3f; } 121 | 122 | .aqua { 123 | background: #7fdbff; } 124 | 125 | .sky { 126 | background: #00b2ff; } 127 | 128 | .teal { 129 | background: #39cccc; } 130 | 131 | .slate { 132 | background: #757b87; } 133 | 134 | .indigo { 135 | background: #281e5d; } 136 | 137 | .cobalt { 138 | background: #1438bd; } 139 | 140 | .ocean { 141 | background: #026063; } 142 | 143 | .peacock { 144 | background: #002d37; } 145 | 146 | .azure { 147 | background: #1621a6; } 148 | 149 | .cerulean { 150 | background: #0592c2; } 151 | 152 | .lapis { 153 | background: #2632c2; } 154 | 155 | .spruce { 156 | background: #2c3e4b; } 157 | 158 | .stone { 159 | background: #59788d; } 160 | 161 | .aegean { 162 | background: #1e456e; } 163 | 164 | .berry { 165 | background: #24146f; } 166 | 167 | .denim { 168 | background: #141e3c; } 169 | 170 | .admiral { 171 | background: #061094; } 172 | 173 | .sapphire { 174 | background: #52b2c0; } 175 | 176 | .arctic { 177 | background: #82edfd; } 178 | 179 | .tan { 180 | background: #e5dbac; } 181 | 182 | .beige { 183 | background: #ecdc99; } 184 | 185 | .macaroon { 186 | background: #f7df75; } 187 | 188 | .hazelwood { 189 | background: #c9bc8e; } 190 | 191 | .granola { 192 | background: #d6b75a; } 193 | 194 | .oat { 195 | background: #dec98a; } 196 | 197 | .eggnog { 198 | background: #fbe29d; } 199 | 200 | .fawn { 201 | background: #c7a951; } 202 | 203 | .sugarcookie { 204 | background: #f3ebad; } 205 | 206 | .sand { 207 | background: #d7b963; } 208 | 209 | .sepia { 210 | background: #e3b678; } 211 | 212 | .latte { 213 | background: #e9c17b; } 214 | 215 | .oyster { 216 | background: #dcd69f; } 217 | 218 | .biscotti { 219 | background: #e3c565; } 220 | 221 | .parmesean { 222 | background: #fee993; } 223 | 224 | .hazelnut { 225 | background: #bda55d; } 226 | 227 | .sandcastle { 228 | background: #dbc27d; } 229 | 230 | .buttermilk { 231 | background: #fdefb2; } 232 | 233 | .sanddollar { 234 | background: #ebe7b9; } 235 | 236 | .shortbread { 237 | background: #fce791; } 238 | 239 | .yellow { 240 | background: #ffdc00; } 241 | 242 | .canary { 243 | background: #fac801; } 244 | 245 | .gold { 246 | background: #f9a602; } 247 | 248 | .daffodil { 249 | background: #feee88; } 250 | 251 | .flaxen { 252 | background: #d5b65a; } 253 | 254 | .butter { 255 | background: #fee226; } 256 | 257 | .lemon { 258 | background: #effd5f; } 259 | 260 | .mustard { 261 | background: #e9b829; } 262 | 263 | .corn { 264 | background: #e4cd04; } 265 | 266 | .medallion { 267 | background: #e4b103; } 268 | 269 | .dandelion { 270 | background: #fdce2a; } 271 | 272 | .bumblebee { 273 | background: #fce206; } 274 | 275 | .banana { 276 | background: #fcf4a3; } 277 | 278 | .butterscotch { 279 | background: #fabd04; } 280 | 281 | .dijon { 282 | background: #c29200; } 283 | 284 | .honey { 285 | background: #ec9707; } 286 | 287 | .blonde { 288 | background: #fdeb75; } 289 | 290 | .pineapple { 291 | background: #ffe327; } 292 | 293 | .tuscansun { 294 | background: #fcd12a; } 295 | 296 | .orange { 297 | background: #ff851b; } 298 | 299 | .tangerine { 300 | background: #f98228; } 301 | 302 | .merigold { 303 | background: #fdae1d; } 304 | 305 | .cider { 306 | background: #b66827; } 307 | 308 | .rust { 309 | background: #8c4005; } 310 | 311 | .ginger { 312 | background: #bc5703; } 313 | 314 | .tiger { 315 | background: #fb6b02; } 316 | 317 | .bronze { 318 | background: #b2560c; } 319 | 320 | .cantaloupe { 321 | background: #fca172; } 322 | 323 | .apricot { 324 | background: #ed810f; } 325 | 326 | .carrot { 327 | background: #ed7116; } 328 | 329 | .squash { 330 | background: #c95c09; } 331 | 332 | .spice { 333 | background: #7a3a03; } 334 | 335 | .marmalade { 336 | background: #d16102; } 337 | 338 | .amber { 339 | background: #893201; } 340 | 341 | .sandstone { 342 | background: #d57128; } 343 | 344 | .yam { 345 | background: #cc5801; } 346 | 347 | .red { 348 | background: #ff4136; } 349 | 350 | .cherry { 351 | background: #9a0f02; } 352 | 353 | .rose { 354 | background: #e2252a; } 355 | 356 | .jam { 357 | background: #600f0b; } 358 | 359 | .merlot { 360 | background: #541f1b; } 361 | 362 | .garnet { 363 | background: #5f0a04; } 364 | 365 | .crimson { 366 | background: #b8100a; } 367 | 368 | .ruby { 369 | background: #900503; } 370 | 371 | .scarlet { 372 | background: #910d08; } 373 | 374 | .redwine { 375 | background: #4c0805; } 376 | 377 | .redapple { 378 | background: #a91b0d; } 379 | 380 | .mahogany { 381 | background: #420d09; } 382 | 383 | .blood { 384 | background: #710c04; } 385 | 386 | .sangria { 387 | background: #5f1914; } 388 | 389 | .currant { 390 | background: #670c07; } 391 | 392 | .blush { 393 | background: #bb544a; } 394 | 395 | .candy { 396 | background: #d31603; } 397 | 398 | .lipstick { 399 | background: #9b0f02; } 400 | 401 | .pink { 402 | background: #f69acd; } 403 | 404 | .fuchsia { 405 | background: #f012be; } 406 | 407 | .punch { 408 | background: #f25278; } 409 | 410 | .watermelon { 411 | background: #fe809c; } 412 | 413 | .flamingo { 414 | background: #fda4b8; } 415 | 416 | .rouge { 417 | background: #f26c8c; } 418 | 419 | .salmon { 420 | background: #fdab9f; } 421 | 422 | .coral { 423 | background: #fe7d67; } 424 | 425 | .peach { 426 | background: #fb9483; } 427 | 428 | .strawberry { 429 | background: #fc4c4e; } 430 | 431 | .rosewood { 432 | background: #a04242; } 433 | 434 | .lemonade { 435 | background: #fabacb; } 436 | 437 | .taffy { 438 | background: #fa85c4; } 439 | 440 | .bubblegum { 441 | background: #fd5ca8; } 442 | 443 | .balletslipper { 444 | background: #f69abf; } 445 | 446 | .crepe { 447 | background: #f1b7c6; } 448 | 449 | .maroon { 450 | background: #85144b; } 451 | 452 | .hotpink { 453 | background: #ff1696; } 454 | 455 | .purple { 456 | background: #b10dc9; } 457 | 458 | .mauve { 459 | background: #7a4a89; } 460 | 461 | .violet { 462 | background: #710193; } 463 | 464 | .boysenberry { 465 | background: #630536; } 466 | 467 | .lavender { 468 | background: #e3a0f6; } 469 | 470 | .plum { 471 | background: #601a36; } 472 | 473 | .lilac { 474 | background: #b65fcd; } 475 | 476 | .periwinkle { 477 | background: #be93d4; } 478 | 479 | .eggplant { 480 | background: #311431; } 481 | 482 | .iris { 483 | background: #9866c5; } 484 | 485 | .heather { 486 | background: #9b7cb9; } 487 | 488 | .amethyst { 489 | background: #a45de4; } 490 | 491 | .raisin { 492 | background: #290916; } 493 | 494 | .orchid { 495 | background: #af69ee; } 496 | 497 | .mulberry { 498 | background: #4d0220; } 499 | 500 | .green { 501 | background: #2ecc40; } 502 | 503 | .chartreuse { 504 | background: #b0fd38; } 505 | 506 | .juniper { 507 | background: #395311; } 508 | 509 | .sage { 510 | background: #728c69; } 511 | 512 | .lime { 513 | background: #01ff70; } 514 | 515 | .fern { 516 | background: #5dbc64; } 517 | 518 | .olive { 519 | background: #98bf64; } 520 | 521 | .emerald { 522 | background: #038911; } 523 | 524 | .pear { 525 | background: #74b62d; } 526 | 527 | .moss { 528 | background: #476d1e; } 529 | 530 | .shamrock { 531 | background: #03ac13; } 532 | 533 | .seafoam { 534 | background: #3cec96; } 535 | 536 | .pine { 537 | background: #24501e; } 538 | 539 | .parakeet { 540 | background: #02c04a; } 541 | 542 | .mint { 543 | background: #98ecc3; } 544 | 545 | .seaweed { 546 | background: #354b21; } 547 | 548 | .pickle { 549 | background: #5a7d36; } 550 | 551 | .pistachio { 552 | background: #b2d3c1; } 553 | 554 | .basil { 555 | background: #32622d; } 556 | 557 | .crocodile { 558 | background: #5f7c3a; } 559 | 560 | .brown { 561 | background: #241709; } 562 | 563 | .coffee { 564 | background: #4b371c; } 565 | 566 | .mocha { 567 | background: #3c290d; } 568 | 569 | .peanut { 570 | background: #795c34; } 571 | 572 | .carob { 573 | background: #35260f; } 574 | 575 | .hickory { 576 | background: #371d10; } 577 | 578 | .pecan { 579 | background: #4a2512; } 580 | 581 | .walnut { 582 | background: #432711; } 583 | 584 | .caramel { 585 | background: #66360f; } 586 | 587 | .gingerbread { 588 | background: #5d2c04; } 589 | 590 | .chocolate { 591 | background: #2c1603; } 592 | 593 | .tortilla { 594 | background: #9a7b4f; } 595 | 596 | .umber { 597 | background: #352415; } 598 | 599 | .tawny { 600 | background: #7e491d; } 601 | 602 | .brunette { 603 | background: #391e07; } 604 | 605 | .cinammon { 606 | background: #642b0d; } 607 | 608 | .penny { 609 | background: #522915; } 610 | 611 | .grey { 612 | background: #aaaaaa; } 613 | 614 | .shadow { 615 | background: #373737; } 616 | 617 | .graphite { 618 | background: #584d5b; } 619 | 620 | .iron { 621 | background: #332d31; } 622 | 623 | .pewter { 624 | background: #6a6880; } 625 | 626 | .cloud { 627 | background: #c5c5d0; } 628 | 629 | .silver { 630 | background: #dddddd; } 631 | 632 | .smoke { 633 | background: #59515f; } 634 | 635 | .anchor { 636 | background: #42424c; } 637 | 638 | .ash { 639 | background: #554c4d; } 640 | 641 | .porpoise { 642 | background: #4d4c5c; } 643 | 644 | .dove { 645 | background: #7c6e7f; } 646 | 647 | .fog { 648 | background: #655965; } 649 | 650 | .flint { 651 | background: #7d7c9c; } 652 | 653 | .pebble { 654 | background: #333333; } 655 | 656 | .lead { 657 | background: #403f4e; } 658 | 659 | .coin { 660 | background: #9897a9; } 661 | 662 | .fossil { 663 | background: #787276; } 664 | 665 | .black { 666 | background: #111111; } 667 | 668 | .ebony { 669 | background: #080401; } 670 | 671 | .crow { 672 | background: #25221F; } 673 | 674 | .charcoal { 675 | background: #222023; } 676 | -------------------------------------------------------------------------------- /palette.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | The New Defaults 7 | 8 | 9 | 10 |

WHITES

11 | 12 |
13 |
14 | white#fffefc 15 |
16 | 17 |
18 | pearl#fbfcf7 19 |
20 | 21 |
22 | alabaster#fefaf0 23 |
24 | 25 |
26 | snow#f4fefd 27 |
28 | 29 |
30 | ivory#fef7e5 31 |
32 | 33 |
34 | cream#fffbda 35 |
36 | 37 |
38 | eggshell#fef9e3 39 |
40 | 41 |
42 | cotton#fbfcf7 43 |
44 | 45 |
46 | chiffon#fafaf1 47 |
48 | 49 |
50 | salt#f8efec 51 |
52 | 53 |
54 | lace#faf3ea 55 |
56 | 57 |
58 | coconut#fff1e6 59 |
60 | 61 |
62 | linen#f2ebd3 63 |
64 | 65 |
66 | bone#e7dfcc 67 |
68 | 69 |
70 | porcelain#fffffc 71 |
72 | 73 |
74 | parchment#fcf6df 75 |
76 | 77 |
78 | rice#fbf6ef 79 |
80 |
81 | 82 |

BLUES

83 | 84 |
85 |
86 | blue#0074d9 87 |
88 | 89 |
90 | navy#001f3f 91 |
92 | 93 |
94 | aqua#7fdbff 95 |
96 | 97 |
98 | sky#00b2ff 99 |
100 | 101 |
102 | teal#39cccc 103 |
104 | 105 |
106 | slate#757b87 107 |
108 | 109 |
110 | indigo#281e5d 111 |
112 | 113 |
114 | cobalt#1438bd 115 |
116 | 117 |
118 | ocean#026063 119 |
120 | 121 |
122 | peacock#002d37 123 |
124 | 125 |
126 | azure#1621a6 127 |
128 | 129 |
130 | cerulean#0592c2 131 |
132 | 133 |
134 | lapis#2632c2 135 |
136 | 137 |
138 | spruce#2c3e4b 139 |
140 | 141 |
142 | stone#59788d 143 |
144 | 145 |
146 | aegean#1e456e 147 |
148 | 149 |
150 | berry#24146f 151 |
152 | 153 |
154 | denim#141e3c 155 |
156 | 157 |
158 | admiral#060f94 159 |
160 | 161 |
162 | sapphire#52b2c0 163 |
164 | 165 |
166 | arctic#82edfe 167 |
168 | 169 |
170 | 171 |

TANS

172 | 173 |
174 |
175 | tan#e5dbac 176 |
177 | 178 |
179 | beige#ecdc99 180 |
181 | 182 |
183 | macaroon#f7df75 184 |
185 | 186 |
187 | hazelwood#c9bc8e 188 |
189 | 190 |
191 | granola#d6b75a 192 |
193 | 194 |
195 | oat#dec98a 196 |
197 | 198 |
199 | eggnog#fbe29d 200 |
201 | 202 |
203 | fawn#c7a951 204 |
205 | 206 |
207 | sand#d7b963 208 |
209 | 210 |
211 | sepia#e3b678 212 |
213 | 214 |
215 | latte#e9c17b 216 |
217 | 218 |
219 | oyster#dcd69f 220 |
221 | 222 |
223 | biscotti#e3c565 224 |
225 | 226 |
227 | parmesean#fee993 228 |
229 | 230 |
231 | hazelnut#bda55d 232 |
233 | 234 |
235 | sandcastle#dbc27d 236 |
237 | 238 |
239 | buttermilk#fdefb2 240 |
241 | 242 |
243 | sanddollar#ebe7b9 244 |
245 | 246 |
247 | shortbread#fce791 248 |
249 | 250 |
251 | 252 |

YELLOWS

253 | 254 |
255 |
256 | yellow#FFDC00 257 |
258 | 259 |
260 | canary#fac801 261 |
262 | 263 |
264 | gold#f9a602 265 |
266 | 267 |
268 | daffodil#feee88 269 |
270 | 271 |
272 | flaxen#d5b65a 273 |
274 | 275 |
276 | butter#fee226 277 |
278 | 279 |
280 | lemon#effd5f 281 |
282 | 283 |
284 | mustard#e9b829 285 |
286 | 287 |
288 | corn#e4cd04 289 |
290 | 291 |
292 | medallion#e4b103 293 |
294 | 295 |
296 | dandelion#fdce2a 297 |
298 | 299 |
300 | bumblebee#fce206 301 |
302 | 303 |
304 | banana#fcf4a3 305 |
306 | 307 |
308 | butterscotch#fabd04 309 |
310 | 311 |
312 | dijon#c29200 313 |
314 | 315 |
316 | honey#ec9707 317 |
318 | 319 |
320 | blonde#fdeb75 321 |
322 | 323 |
324 | pineapple#ffe327 325 |
326 | 327 |
328 | tuscansun#fcd12a 329 |
330 |
331 | 332 |

ORANGES

333 | 334 |
335 |
336 | orange#ff851b 337 |
338 | 339 |
340 | tangerine#f98228 341 |
342 | 343 |
344 | merigold#fdae1d 345 |
346 | 347 |
348 | cider#b66827 349 |
350 | 351 |
352 | rust#8c4005 353 |
354 | 355 |
356 | ginger#bc5703 357 |
358 | 359 |
360 | tiger#fb6b02 361 |
362 | 363 |
364 | bronze#b2560c 365 |
366 | 367 |
368 | cantaloupe#fca172 369 |
370 | 371 |
372 | apricot#ed810f 373 |
374 | 375 |
376 | carrot#ed7116 377 |
378 | 379 |
380 | squash#c95c09 381 |
382 | 383 |
384 | spice#7a3a03 385 |
386 | 387 |
388 | marmalade#d16102 389 |
390 | 391 |
392 | amber#893201 393 |
394 | 395 |
396 | sandstone#d57128 397 |
398 | 399 |
400 | yam#cc5801 401 |
402 | 403 |
404 | 405 |

REDS

406 | 407 |
408 |
409 | red#ff4136 410 |
411 | 412 |
413 | cherry#9a0f02 414 |
415 | 416 |
417 | rose#e2252a 418 |
419 | 420 |
421 | jam#600f0b 422 |
423 | 424 |
425 | merlot#541f1b 426 |
427 | 428 |
429 | garnet#5f0a04 430 |
431 | 432 |
433 | crimson#b8100a 434 |
435 | 436 |
437 | ruby#900503 438 |
439 | 440 |
441 | scarlet#910d08 442 |
443 | 444 |
445 | redwine#4c0805 446 |
447 | 448 |
449 | redapple#a91b0d 450 |
451 | 452 |
453 | mahogany#420d09 454 |
455 | 456 |
457 | blood#710c04 458 |
459 | 460 |
461 | sangria#5f1914 462 |
463 | 464 |
465 | currant#670c07 466 |
467 | 468 |
469 | blush#bb544a 470 |
471 | 472 |
473 | candy#d31603 474 |
475 | 476 |
477 | lipstick#9b0f02 478 |
479 | 480 |
481 | 482 |

PINKS

483 | 484 |
485 | 486 |
487 | pink#f69acd 488 |
489 | 490 |
491 | fuchsia#f012be 492 |
493 | 494 |
495 | punch#f25278 496 |
497 | 498 |
499 | watermelon#fe809c 500 |
501 | 502 |
503 | flamingo#fda4b8 504 |
505 | 506 |
507 | rouge#f26c8c 508 |
509 | 510 |
511 | salmon#fdab9f 512 |
513 | 514 |
515 | coral#fe7d67 516 |
517 | 518 |
519 | peach#fb9483 520 |
521 | 522 |
523 | strawberry#fc4c4e 524 |
525 | 526 |
527 | rosewood#a04242 528 |
529 | 530 |
531 | lemonade#fabacb 532 |
533 | 534 |
535 | taffy#fa85c4 536 |
537 | 538 |
539 | bubblegum#fd5ca8 540 |
541 | 542 |
543 | balletslipper#f69abf 544 |
545 | 546 |
547 | crepe#f1b7c6 548 |
549 | 550 |
551 | maroon#85144be 552 |
553 | 554 |
555 | hotpink#ff1696 556 |
557 | 558 |
559 | 560 |

PURPLES

561 | 562 |
563 | 564 |
565 | purple#b10dc9 566 |
567 | 568 |
569 | mauve#7a4a89 570 |
571 | 572 |
573 | violet#710193 574 |
575 | 576 |
577 | boysenberry 578 | #630536 579 |
580 | 581 |
582 | lavender#e3a0f6 583 |
584 | 585 |
586 | maroon#85144B 587 |
588 | 589 |
590 | plum#601a36 591 |
592 | 593 |
594 | lilac#b65fcd 595 |
596 | 597 |
598 | periwinkle#be93d4 599 |
600 | 601 |
602 | eggplant#311431 603 |
604 | 605 |
606 | iris#9866c5 607 |
608 | 609 |
610 | heather#9b7cb9 611 |
612 | 613 |
614 | amethyst#a45de4 615 |
616 | 617 |
618 | raisin#290916 619 |
620 | 621 |
622 | orchid#af69ee 623 |
624 | 625 |
626 | mulberry#4d0220 627 |
628 | 629 |
630 | 631 |

GREENS

632 | 633 |
634 | 635 |
636 | green#2ecc40 637 |
638 | 639 |
640 | chartreuse#b0fc37 641 |
642 | 643 |
644 | juniper#395311 645 |
646 | 647 |
648 | sage#728c69 649 |
650 | 651 |
652 | lime#01ff70 653 |
654 | 655 |
656 | fern#5dbc64 657 |
658 | 659 |
660 | olive#98bf64 661 |
662 | 663 |
664 | emerald#038911 665 |
666 | 667 |
668 | pear#74b62d 669 |
670 | 671 |
672 | moss#476d1e 673 |
674 | 675 |
676 | shamrock#03ac13 677 |
678 | 679 |
680 | seafoam#3cec96 681 |
682 | 683 |
684 | pine#24501e 685 |
686 | 687 |
688 | parakeet#02c04a 689 |
690 | 691 |
692 | mint#98ecc3 693 |
694 | 695 |
696 | seaweed#354b21 697 |
698 | 699 |
700 | pickle#5a7d36 701 |
702 | 703 |
704 | pistachio#b2d3c1 705 |
706 | 707 |
708 | basil#32622d 709 |
710 | 711 |
712 | crocodile#5f7c3a 713 |
714 | 715 |
716 | 717 |

BROWNS

718 | 719 |
720 | 721 |
722 | brown#241709 723 |
724 | 725 |
726 | coffee#4b371c 727 |
728 | 729 |
730 | mocha#3c290d 731 |
732 | 733 |
734 | peanut#795c34 735 |
736 | 737 |
738 | carob#35260f 739 |
740 | 741 |
742 | hickory#371d10 743 |
744 | 745 |
746 | pecan#4a2512 747 |
748 | 749 |
750 | walnut#432711 751 |
752 | 753 |
754 | caramel#66360f 755 |
756 | 757 |
758 | gingerbread#5d2c04 759 |
760 | 761 |
762 | chocolate#2c1603 763 |
764 | 765 |
766 | tortilla#9a7b4f 767 |
768 | 769 |
770 | umber#352415 771 |
772 | 773 |
774 | tawny#7e491d 775 |
776 | 777 |
778 | brunette#391e07 779 |
780 | 781 |
782 | cinammon#642b0d 783 |
784 | 785 |
786 | penny#522915 787 |
788 | 789 |
790 | 791 |

GREYS

792 | 793 |
794 |
795 | grey#aaaaaa 796 |
797 | 798 |
799 | shadow#373737 800 |
801 | 802 |
803 | graphite#584d5b 804 |
805 | 806 |
807 | iron#332d31 808 |
809 | 810 |
811 | pewter#6a6880 812 |
813 | 814 |
815 | cloud#c5c5d0 816 |
817 | 818 |
819 | silver#dddddd 820 |
821 | 822 |
823 | smoke#59515f 824 |
825 | 826 |
827 | anchor#42424c 828 |
829 | 830 |
831 | ash#554c4d 832 |
833 | 834 |
835 | porpoise#4d4c5d 836 |
837 | 838 |
839 | dove#7c6e7f 840 |
841 | 842 |
843 | fog#655965 844 |
845 | 846 |
847 | flint#7d7c9c 848 |
849 | 850 |
851 | pebble#333333 852 |
853 | 854 |
855 | lead#403f4e 856 |
857 | 858 |
859 | coin#9897a9 860 |
861 | 862 |
863 | fossil#787276 864 |
865 | 866 |
867 | 868 |

BLACKS

869 | 870 |
871 |
872 | black#111111 873 |
874 | 875 |
876 | ebony#080401 877 |
878 | 879 |
880 | crow#3d3934 881 |
882 | 883 |
884 | charcoal#222023 885 |
886 | 887 |
888 | 889 | 890 | --------------------------------------------------------------------------------