Skip to main content
Home/Explorer/Raycast

Raycast

Productivity launcher and developer tools

Command palette UI

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

Colors

#ffffff
#6a6b6c
#9c9c9d
#434345

Typography

Inter, Inter Fallback
hero:64px / 600
body:16px / 400
button:24px / 500

Shadows

sm
md
lg

Spacing

1px2px2.5px3px4px8px

Border Radius

2px
2.5px
3px
4px
5px

Button States

Radix UI
Default
#e6e6e6
Hover
#000000
Active
#ffffff
radius: 8pxpadding: 8px 12px
output.json
{
  "url": "raycast.com",
  "colors": [
    "#ffffff",
    "#6a6b6c",
    "#9c9c9d",
    "#434345"
  ],
  "typography": {
    "fontFamily": "Inter, Inter Fallback",
    "hero": "64px / 600",
    "body": "16px / 400",
    "button": "24px / 500"
  },
  "shadows": [
    "rgba(0, 0, 0, 0.4) 0px 1.5px 0.5px 2.5px, rgb(0, 0, 0) 0px 0px 0.5px 1px, rgba(0, 0, 0, 0.25) 0px 2px 1px 1px inset",
    "rgb(27, 28, 30) 0px 0px 0px 1px, rgb(7, 8, 10) 0px 0px 0px 1px inset",
    "rgba(215, 201, 175, 0.05) 0px 0px 20px 5px"
  ],
  "spacing": [
    "1px",
    "2px",
    "2.5px",
    "3px",
    "4px",
    "8px"
  ],
  "borderRadius": [
    "2px",
    "2.5px",
    "3px",
    "4px",
    "5px"
  ],
  "buttons": {
    "default": {
      "bg": "#e6e6e6",
      "text": "#2f3031"
    },
    "hover": {
      "bg": "#000000",
      "text": "#2f3031"
    },
    "active": {
      "bg": "#ffffff",
      "text": "#2f3031"
    },
    "radius": "8px",
    "padding": "8px 12px",
    "framework": "Radix UI"
  }
}
$npx dembrandt raycast.com