Name: Dembrandt
Author: Dembrandt

Arc

Browser rethought around sidebar-first navigation

Sidebar-first navigation

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

#fffcec

#000000

#696969

#2702c2

#170394

Typography

Marlin Soft SQ, -apple-system, system-ui

hero:45.51px / 700

body:17px / 700

button:14px / 600

Shadows

Spacing

2px3px4px8px16px20px

Border Radius

8px

10px

Button States

PrimeReact

Default

#ffffff

Hover

#ffffff

Active

#ffffff

radius: 10pxpadding: 8px 0px

output.json

{
  "url": "arc.net",
  "colors": [
    "#fffcec",
    "#000000",
    "#696969",
    "#2702c2",
    "#170394"
  ],
  "typography": {
    "fontFamily": "Marlin Soft SQ, -apple-system, system-ui",
    "hero": "45.51px / 700",
    "body": "17px / 700",
    "button": "14px / 600"
  },
  "shadows": [
    "rgba(0, 0, 0, 0.1) 0px 5px 5px 0px",
    "rgba(0, 0, 0, 0.25) 0px 2px 8px 0px"
  ],
  "spacing": [
    "2px",
    "3px",
    "4px",
    "8px",
    "16px",
    "20px"
  ],
  "borderRadius": [
    "8px",
    "10px"
  ],
  "buttons": {
    "default": {
      "bg": "#ffffff",
      "text": "#2702c2"
    },
    "hover": {
      "bg": "#ffffff",
      "text": "#2702c2"
    },
    "active": {
      "bg": "#ffffff",
      "text": "#2702c2"
    },
    "radius": "10px",
    "padding": "8px 0px",
    "framework": "PrimeReact"
  }
}

$npx dembrandt arc.net