[Design systems](/design-systems/) / Aithagoni

# Aithagoni design system

aithagoni.com

Read from Aithagoni's public website by Clinical Terminal. Not reviewed by Aithagoni. Copy it and paste it into Claude as inspiration.

Corrections or removal: <agent@clinicalterminal.com>

![Aithagoni logo](https://firebasestorage.googleapis.com/v0/b/clinical-ai-design.firebasestorage.app/o/snapshots%2Fdesign-systems%2Flogos%2F100923637.png?alt=media)

## Palette

- Ground

  \#FCFBFE

- Ink

  \#131B42

- Accent on the ground

  \#2C398A

- Primary

  \#2C398A

- On primary

  \#FFFFFF

  \--color-white

- Dark

  \#131B42

- Site background

  \#FCFBFE

## Color ramps

Color Red

100

\#FFE2E2

300

\#FFA3A3

400

\#FF6568

500

\#FB2C36

Color Blue

50

\#EFF6FF

100

\#DBEAFE

200

\#BEDBFF

300

\#90C5FF

500

\#3080FF

600

\#155DFC

Color Indigo

50

\#EEF2FF

100

\#E0E7FF

200

\#C7D2FF

400

\#7D87FF

500

\#625FFF

950

\#1E1A4D

Color Purple

100

\#F3E8FF

200

\#E9D5FF

400

\#C07EFF

500

\#AC4BFF

600

\#9810FA

Color Zinc

50

\#FAFAFA

100

\#F4F4F5

200

\#E4E4E7

300

\#D4D4D8

400

\#9F9FA9

500

\#71717B

600

\#52525C

700

\#3F3F46

800

\#27272A

900

\#18181B

950

\#09090B

## Other named colors

- \--color-black #000000
- \--color-white #FFFFFF
- \--color-amber-400 #FCBB00
- \--color-green-500 #00C758
- \--color-green-600 #00A544
- \--color-emerald-500 #00BB7F
- \--color-emerald-600 #009767
- \--color-slate-900 #0F172B

## Type

Headings

Plus Jakarta Sans

Aithagoni at a glance

Body

Plus Jakarta Sans

Clear, readable paragraphs for clinicians, buyers and patients alike.

- 44pxAithagoni
- 38pxAithagoni
- 17pxAithagoni
- 15pxAithagoni
- 14.5pxAithagoni
- 13.5pxAithagoni
- 13pxAithagoni
- 12pxAithagoni

## Shape & depth

Cards and panels: 0px corners · buttons and chips: 8px.

### Corner radii

- .25rem

  used in 1 rule

## Voice

Tone: professional. Energy: low. Written for patients and healthcare professionals.

## DESIGN.md

The file Copy design system puts on your clipboard. [Open the raw file](https://firebasestorage.googleapis.com/v0/b/clinical-ai-design.firebasestorage.app/o/snapshots%2Fdesign-systems%2Fmd%2F100923637.md?alt=media).

```
---
generator: clinical-terminal-brand-kit
company: "Aithagoni"
domain: "aithagoni.com"
colors:
  primary: "#2C398A"
  onPrimary: "#FFFFFF"
  dark: "#131B42"
  background: "#FCFBFE"
ground:
  mode: light
  hex: "#FCFBFE"
  ink: "#131B42"
  accent: "#2C398A"
fonts:
  heading: "Plus Jakarta Sans"
  body: "Plus Jakarta Sans"
radius:
  card: "0px"
  button: "8px"
---

# Design System — Aithagoni

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

## Ground
- **Light ground** (#FCFBFE), from Aithagoni's site background #FCFBFE. Pages and panels sit on it.
- Main text: #131B42 (16.13:1 on the ground).
- Secondary text is #131B42 at 88% / 76% / 60%; hairlines and plate borders #131B42 at 16%.

## Color
- **Accent on the ground: #2C398A** (9.89:1). Use it for kickers, key numbers and one highlight per screen, not for large fills.
- **Primary #2C398A** for filled shapes (buttons, chips, bars), with #FFFFFF text on it (10.2:1).
- Quote every hex exactly as written above.

## Type
- Headlines: **Plus Jakarta Sans**. Body: **Plus Jakarta Sans**. Both on Google Fonts.

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

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

## Tokens from the site's stylesheets

### Color ramps

- **Color Red** (`--color-red-N`): 100 `#FFE2E2` · 300 `#FFA3A3` · 400 `#FF6568` · 500 `#FB2C36`
- **Color Blue** (`--color-blue-N`): 50 `#EFF6FF` · 100 `#DBEAFE` · 200 `#BEDBFF` · 300 `#90C5FF` · 500 `#3080FF` · 600 `#155DFC`
- **Color Indigo** (`--color-indigo-N`): 50 `#EEF2FF` · 100 `#E0E7FF` · 200 `#C7D2FF` · 400 `#7D87FF` · 500 `#625FFF` · 950 `#1E1A4D`
- **Color Purple** (`--color-purple-N`): 100 `#F3E8FF` · 200 `#E9D5FF` · 400 `#C07EFF` · 500 `#AC4BFF` · 600 `#9810FA`
- **Color Zinc** (`--color-zinc-N`): 50 `#FAFAFA` · 100 `#F4F4F5` · 200 `#E4E4E7` · 300 `#D4D4D8` · 400 `#9F9FA9` · 500 `#71717B` · 600 `#52525C` · 700 `#3F3F46` · 800 `#27272A` · 900 `#18181B` · 950 `#09090B`

### Other named colors

- `--color-black`: `#000000`
- `--color-white`: `#FFFFFF`
- `--color-amber-400`: `#FCBB00`
- `--color-green-500`: `#00C758`
- `--color-green-600`: `#00A544`
- `--color-emerald-500`: `#00BB7F`
- `--color-emerald-600`: `#009767`
- `--color-slate-900`: `#0F172B`

### Typefaces

- Plus Jakarta Sans (`--font-sans`) — on Google Fonts

### Type scale (most-used sizes)

`44px` · `38px` · `17px` · `15px` · `14.5px` · `13.5px` · `13px` · `12px` · `11px` · `10px` · `9px` · `8px`

### Letter-spacing

`.1em` (1)

### Corner radii (most-used)

`.25rem`
```