Designing accessible color systems(stripe.com)

over 3 years ago from Wilson Miner, Product Designer at Stripe

  • Matthew BlodeMatthew Blode, over 3 years ago

    Incredible work!! What software did you use to map the shades of colour along the lightness, chroma, and hue graph? It looks like a custom Stripe interface.

    Is the Stripe design system publically available? You all do such great work!

    Finally, why is mid-Orange on a white background always rated so low when using a contrast checker?

    1 point
    • Wilson MinerWilson Miner, over 3 years ago

      Yellow is tough! Yellow and orange are the lightest hues perceptually, and there's really "no such thing" as a dark AND bright yellow. So we made those colors a touch lighter than some of the others to get a little more saturation out of them. That's also why we pair the text colors with a lighter color (either an icon or a background color) that has more saturation, so the color is easier to distinguish.

      Our design system is internal for the time being, but we're trying to share more about it, like this post!

      2 points