search

mapbox / assembly

Making the hard parts of designing for the web easy.
https://www.mapbox.com/assembly/
134 stars 27 forks source link

961 Adjust color scale #997

Closed aparlato closed 3 years ago

aparlato commented 3 years ago

@samanpwbb I decided to take the suggested approach of adjusting hue and then minor adjustments from the MBX Assembly palette from the ticket. This made sense to keep the contrast similar.

I'm not sure this goes far enough however to differentiate itself from the mbx palette. Let me know if I should take another pass.

Note that the images here say medium but we changed it to deep.

Updated regular assembly color palette

image

Previous comparison of mbx and regular assembly color palettes:

Before update. left: mbx assembly | right: regular assembly

New comparison of mbx (from #961) and regular assembly color palettes

After update. left: mbx assembly | right: regular assembly

Comparison of new colors next to each other:

image

Link to Figma

samanpwbb commented 3 years ago

@aparlato as part of this PR can you share the before/after results from npm run check-size?

aparlato commented 3 years ago

Before: CSS: 172 kB (minified) => 21.6 kB (gzipped) SVG: 50.7 kB => 15.9 kB (gzipped)

After: CSS: 181 kB (minified) => 22.6 kB (gzipped) SVG: 50.7 kB => 15.9 kB (gzipped)