screenroveSCREENS WORTH STUDYING
Screenrove / Design references

Stripe Product Screens

Explore captured product screens and their navigation.

Stripe Docs home

Docs home

Stripe Docs home, logged out: a pale grey header with Search ("/" shortcut), Ask AI, Create account and Sign in, a product tab row, and a Documentation hero with a "Test cards" illustration. Payments, Revenue and Developers link columns sit above an interactive "Try it out" panel whose dark code block shows the command for the selected recipe (default: a tax rate).

Stripe Try it out: Create a customer

Try it out: Create a customer

Choosing "Create a customer" in the Try it out list highlights that row and swaps the dark code block to a sample stripe customers create command with its JSON response (Stripe's placeholder customer "Jenny Rosen").

Stripe APIs & SDKs menu

APIs & SDKs menu

The APIs & SDKs header menu opens a small white popover: API, Stripe.js and CLI, then iOS, Android and React Native with external-link icons.

Stripe Search overlay

Search overlay

The search dialog over a dimmed page with the query "Build a payments page": five document results with icons, matched terms highlighted and breadcrumb trails, a View more results link, then an "Ask AI Assistant" group with suggested questions. The first result has a focus outline. No AI question was sent.

Stripe Guide: Build a payments page

Guide: Build a payments page

A docs article with a collapsible left navigation (Build a payments page expanded, Overview active), breadcrumbs, title and lead, an action row (Ask about this page, Copy for LLM, View as Markdown, Install tools), then an "Accept payments on your website" block with an isometric product illustration and a Stripe Checkout section with dark UI thumbnails.

Stripe Quickstart: Stripe-hosted page

Quickstart: Stripe-hosted page

A two-column quickstart: Frontend (HTML, React, Next.js) and Backend (Ruby, Node.js, PHP, Python, Go, .NET, Java) pill selectors, prose steps with a Download example button on the left, and a dark indigo panel on the right with a live checkout Preview ("Stubborn Attachments") above tabbed, line-numbered server code.

Stripe API reference

API reference

The API reference has its own chrome: a narrow left sidebar (Find anything, Ask AI, Introduction active, then Core Resources), a version selector (2026-08-26.dahlia) in the header, and two-column sections pairing prose with dark code cards (Base URL, client library icons, authenticated request).

Stripe API reference: Customers

API reference: Customers

The Customers section: description on the left, an Endpoints / Events tab list with method-coloured paths (POST, GET, DELETE) on the right, then "The Customer object" with attribute rows beside a dark JSON sample.