Stripe’s New Design Update

Today, Stripe launched a new design update on their site, specifically the homepage, which you can check out at stripe.com.

It’s clear to me that the design style is derivative from the changes made to macOS 11.0. I love it. The transparency in the product examples feels light, playful, and fresh. I also enjoy the skeuomorphic effect on the other elements on the page, specifically the payment card reader. While Stripe has always blurred the lines between iOS 6 and iOS 7 by maintaining some level of skeuomorphism but also incorporating minimalism, it was no surprise to see that they’ve continued to stick with this style.

One accessibility issue I have with the page is the navigation. While watching the different gradient colors change within the header is mesmerizing, the white text on a transparent background makes it difficult to read. After running it through Contrast, an accessibility tool to check color contrast ratios, I found it failed on the lighter blues and yellows used in the gradient. I ran the same tests on the darker navy color used in the large heading and found the same issues. The gradient partially overlayed on top of the text makes it feel oversaturated at specific points. I’m unsure if that’s on purpose.

Stripe’s attention to detail shines through with this update. You can see this when hovering over buttons, icons, and dropdowns, where subtle transitions feel magical. Once you click on icons further down the page, you’ll see brilliant motion and transitions. Truly great work from the team who worked on this.