---
generator: clinical-terminal-brand-kit
company: "Rad AI"
domain: "radai.com"
colors:
  primary: "#43D2FF"
  onPrimary: "#03091C"
  dark: "#03091C"
  background: "#F6F8FF"
ground:
  mode: light
  hex: "#F6F8FF"
  ink: "#03091C"
  accent: "#0079A3"
fonts:
  heading: "Inter"
  body: "Inter"
radius:
  card: "4px"
  button: "8px"
---

# Design System — Rad AI

> Read from Rad AI's public website (radai.com) by Clinical Terminal. Not reviewed by Rad AI.
> Use it as inspiration: borrow the ideas, not Rad AI's name, logo or identity.

## Ground
- **Light ground** (#F6F8FF), from Rad AI's site background #F6F8FF. Pages and panels sit on it.
- Main text: #03091C (18.67:1 on the ground).
- Secondary text is #03091C at 88% / 76% / 60%; hairlines and plate borders #03091C at 16%.

## Color
- **Accent on the ground: #0079A3** (4.64:1), adjusted from Rad AI's primary #43D2FF so it stays readable. Use it for kickers, key numbers and one highlight per screen, not for large fills.
- **Primary #43D2FF** for filled shapes (buttons, chips, bars), with #03091C text on it (11.23:1).
- Quote every hex exactly as written above.

## Type
- Headlines: **Inter**. Body: **Inter**. Both on Google Fonts.

## Shape
- Cards and panels: 4px corners. Buttons and chips: 8px.

## Voice
- Tone: professional. Energy: medium. Written for patients and healthcare professionals.
- Headlines are short and concrete.

## Tokens from the site's stylesheets

### Other named colors

- `--grey-light`: `#F6F8FF`
- `--dark`: `#03091C`
- `--main-purple`: `#7A4BFD`
- `--dark-purple`: `#372285`
- `--main-blue`: `#43D2FF`
- `--dark-blue`: `#009ACB`
- `--ultra-medium-purple`: `#B9B6FE`
- `--ultra-light`: `#FFFFFF`
- `--ultra-max-dark-purple`: `#120B35`
- `--ultra-dark-purple`: `#231B5A`
- `--light-purple`: `#836DFF`
- `--ultra-light-purple`: `#BAB7FF`
- `--grey`: `#EDF0F8`
- `--light`: `#FAFAFA`
- `--black`: `#000000`
- `--ultra-max-light-purple`: `#E4E3F8`
- `--dark-80`: `#03091C`
- `--scrub-text_color-1`: `#BEC3CE`
- `--scrub-text_color-2`: `#03091C`

### Typefaces

- Inter (`--fonts--body`) — on Google Fonts
- IBM Plex Mono (`--fonts--secondary`)

### Type scale (most-used sizes)

`40px` · `24px` · `1.25rem` · `18px` · `1.1rem` · `1rem` · `16px` · `.9rem` · `.875rem` · `14px` · `.75rem` · `12px`

### Letter-spacing

`-.02em` (10) · `-.03em` (4) · `-.2em` (3) · `-3px` (1) · `-.05em` (1) · `.05em` (1)

### Corner radii (most-used)

`.25rem` · `.5rem` · `1rem` · `.375rem` · `3px` · `50%` · `999rem` · `10px` · `100%` · `2px`

### Shadows

- `0 0 0 1px #0000001a,0 1px 3px #0000001a`
- `0 0 3px #3336`
- `0 0 0 2px #fff`
- `0 0 3px 1px #3898ec`
- `0 0 0 .5px #d9d9d9`
- `1px 1px #0000001a`

### Gradients

- `linear-gradient(#0d0b2c,#1f154f)`
- `linear-gradient(#0000,#0000)`
- `linear-gradient(to bottom,null,null)`
- `linear-gradient(90deg,#02516b,#029bcc)`
- `linear-gradient(#0000,#e0e0f8)`
- `linear-gradient(#f7f8fd,#e3ddfd)`

### Breakpoints

389px · 479px · 767px · 768px · 991px · 992px · 1600px