---
generator: clinical-terminal-brand-kit
company: "Quadax, Inc."
domain: "quadax.com"
colors:
  primary: "#FFC72C"
  onPrimary: "#1A1A1A"
  dark: "#1A1A1A"
  background: "#FFFFFF"
ground:
  mode: light
  hex: "#FFFFFF"
  ink: "#1A1A1A"
  accent: "#A06C00"
fonts:
  heading: "Montserrat"
  body: "Open Sans"
radius:
  card: "4px"
  button: "0px"
---

# Design System — Quadax, Inc.

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

## Ground
- **Light ground** (#FFFFFF), from Quadax, Inc.'s site background #FFFFFF. Pages and panels sit on it.
- Main text: #1A1A1A (17.4:1 on the ground).
- Secondary text is #1A1A1A at 88% / 76% / 60%; hairlines and plate borders #1A1A1A at 16%.

## Color
- **Accent on the ground: #A06C00** (4.53:1), adjusted from Quadax, Inc.'s primary #FFC72C so it stays readable. Use it for kickers, key numbers and one highlight per screen, not for large fills.
- **Primary #FFC72C** for filled shapes (buttons, chips, bars), with #1A1A1A text on it (11.15:1).
- Quote every hex exactly as written above.

## Type
- Headlines: **Montserrat**. Body: **Open Sans**. Both on Google Fonts.

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

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

## Tokens from the site's stylesheets

### Other named colors

- `--plauditQueryLoop__popover--background`: `#FFFFFF`
- `--ep-c-white`: `#FFFFFF`
- `--ep-c-medium-white`: `#EEEEEE`
- `--ep-c-white-gray`: `#CCCCCC`
- `--ep-c-white-red`: `#FFE8ED`
- `--ep-c-white-yellow`: `#FDEECA`
- `--ep-c-medium-gray`: `#626262`
- `--ep-c-light-gray`: `#999999`
- `--ep-c-black`: `#000000`
- `--ep-c-medium-red`: `#D73C38`
- `--ep-c-dark-red`: `#B93431`
- `--ep-c-medium-dark-blue`: `#0073AA`
- `--ep-status-ok`: `#6AA000`
- `--ep-status-warning`: `#E3E600`
- `--ep-default-icon-color`: `#82878C`
- `--color_blue`: `#005CC5`
- `--color_gold`: `#FFC72C`
- `--color_blue-gray`: `#F2F6FA`
- `--color_alice-blue`: `#E8F0FA`
- `--color_horizontal-rule`: `#DADFE5`
- `--color_text-dark`: `#1A1A1A`
- `--color_text-light`: `#FFFFFF`
- `--color_heading-dark`: `#102D51`
- `--color_heading-light`: `#FFFFFF`
- `--color_eyebrow-dark`: `#005CC5`
- `--color_eyebrow-light`: `#FFFFFF`
- `--color_link-underline-dark`: `#FF9600`
- `--color_button-outline-light`: `#FFFFFF`
- `--color_button-outline-hover-light`: `#D4DFEE`
- `--color_button-outline-active-light`: `#A6BDDE`
- `--color_arrow-link-light`: `#FFFFFF`
- `--color_form-asterisk-light`: `#FFFFFF`
- `--gf-ctrl-border-color`: `#8EA6C2`
- `--gf-form-validation-bg-color`: `#FDF9F9`
- `--gf-ctrl-desc-border-color-consent`: `#1D1F33`
- `--gf-ctrl-outline-color-focus`: `#8EA6C2`
- `--gf-ctrl-border-color-focus`: `#CCCCCC`
- `--gradient_fog_color-1`: `#FFFFFF`
- `--gradient_fog_color-2`: `#E8F0FA`
- `--gradient_blue_color-1`: `#005CC5`
- `--gradient_blue_color-2`: `#004B9F`
- `--color_blue-0`: `#00326A`

### Typefaces

- Open Sans (`--font_family`) — on Google Fonts
- Montserrat (`--font_family-heading`) — on Google Fonts

### Type scale (most-used sizes)

`48px` · `36px` · `28px` · `24px` · `1.3333rem` · `18px` · `1.0667rem` · `16px` · `1rem` · `.9333rem` · `13px` · `12px`

### Letter-spacing

`.15em` (1)

### Corner radii (most-used)

`9999px` · `500px` · `12px` · `6px` · `4px` · `100%`

### Shadows

- `2px 2px 6px 2px rgba(0,50,106,.09)`
- `0 2px 4px 2px rgba(0,50,106,.05)`
- `0 0 12px 0 rgba(0,50,106,.14)`
- `0 0 8px 0 rgba(0,0,0,.2)`

### Gradients

- `linear-gradient(#000,#000)`
- `linear-gradient(0deg,transparent,#000 5px)`
- `linear-gradient(90deg,transparent,#000 360px)`
- `linear-gradient(180deg,transparent,#000 80px)`
- `linear-gradient(135deg,#00d084,#0693e3)`
- `linear-gradient(135deg,#34e2e4,#4721fb 50%,#ab1dfe)`

### Breakpoints

600px · 781px · 782px · 960px