Name: Dembrandt
Author: Dembrandt

Stripe

Online payment processing platform

Gradient mesh backgrounds

Stripe Linear Notion OpenAI Tesla Airbnb Figma Slack Uber Apple Raycast Krea AI Family Oura Nike Duolingo Arc Perplexity AI Anthropic Vercel Cursor

Observed with Dembrandt. Showing a simplified version — the full output includes button states, gradients, animations, and more. Try the CLI for complete results.

Design tokens observed from publicly visible CSS. Dembrandt does not host, copy, or redistribute any brand assets.

Colors

#635bff

#0a2540

#00d4ff

#7a73ff

#f6f9fc

#ffffff

Typography

Inter, system-ui, sans-serif

hero:80px / 700

body:20px / 400

button:16px / 600

Shadows

Spacing

4px8px16px24px32px48px

Border Radius

8px

12px

16px

Button States

React + Next.js

Default

#635bff

Hover

#7a73ff

Active

#4b44d6

radius: 8pxpadding: 12px 20px

output.json

{
  "url": "stripe.com",
  "colors": [
    "#635bff",
    "#0a2540",
    "#00d4ff",
    "#7a73ff",
    "#f6f9fc",
    "#ffffff"
  ],
  "typography": {
    "fontFamily": "Inter, system-ui, sans-serif",
    "hero": "80px / 700",
    "body": "20px / 400",
    "button": "16px / 600"
  },
  "shadows": [
    "0 2px 4px rgba(0,0,0,0.08)",
    "0 8px 24px rgba(99,91,255,0.15)",
    "0 24px 48px rgba(0,0,0,0.2)"
  ],
  "spacing": [
    "4px",
    "8px",
    "16px",
    "24px",
    "32px",
    "48px"
  ],
  "borderRadius": [
    "8px",
    "12px",
    "16px"
  ],
  "buttons": {
    "default": {
      "bg": "#635bff",
      "text": "#ffffff"
    },
    "hover": {
      "bg": "#7a73ff",
      "text": "#ffffff"
    },
    "active": {
      "bg": "#4b44d6",
      "text": "#ffffff"
    },
    "radius": "8px",
    "padding": "12px 20px",
    "framework": "React + Next.js"
  }
}

$npx dembrandt stripe.com