Clinical Terminal
AboutSign in

Medusind design system

medusind.com

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

Corrections or removal: agent@clinicalterminal.com

Medusind logo

Palette

Color ramps

Color Neutral
50
#FAFAFA
100
#F5F5F5
200
#E5E5E5
400
#A1A1A1
500
#737373
600
#525252

Other named colors

Type

Headings
Archivo · closest free match for Oxygen

Medusind at a glance

Body
Roboto

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

Shape & depth

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

Corner radii

Shadows

Gradients

Breakpoints: 1160px · 1280px

Voice

Tone: professional. Energy: high. Written for businesses.

DESIGN.md

The file Copy design system puts on your clipboard. Open the raw file.

---
generator: clinical-terminal-brand-kit
company: "Medusind"
domain: "medusind.com"
colors:
  primary: "#F59E0B"
  onPrimary: "#171717"
  dark: "#171717"
  background: "#FFFFFF"
ground:
  mode: light
  hex: "#FFFFFF"
  ink: "#171717"
  accent: "#B26000"
fonts:
  heading: "Archivo"
  body: "Roboto"
radius:
  card: "0px"
  button: "6px"
---

# Design System — Medusind

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

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

## Color
- **Accent on the ground: #B26000** (4.6:1), adjusted from Medusind's primary #F59E0B so it stays readable. Use it for kickers, key numbers and one highlight per screen, not for large fills.
- **Primary #F59E0B** for filled shapes (buttons, chips, bars), with #171717 text on it (8.35:1).
- Quote every hex exactly as written above.

## Type
- Headlines: **Archivo**. Body: **Roboto**. Both on Google Fonts.
- Medusind's site uses Oxygen / Roboto; these are the closest free look-alikes.

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

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

## Tokens from the site's stylesheets

### Color ramps

- **Color Neutral** (`--color-neutral-N`): 50 `#FAFAFA` · 100 `#F5F5F5` · 200 `#E5E5E5` · 400 `#A1A1A1` · 500 `#737373` · 600 `#525252`

### Other named colors

- `--color-black`: `#000000`
- `--color-white`: `#FFFFFF`
- `--color-ink`: `#171717`
- `--color-canvas`: `#FFFFFF`
- `--color-subdued`: `#737373`
- `--color-accent`: `#F59E0B`
- `--color-cornflower-blue`: `#4C87C6`
- `--color-navy`: `#08457E`
- `--color-dark-navy`: `#04223E`
- `--color-sky-blue`: `#EEF5FF`
- `--color-light-blue`: `#D7E6FF`
- `--color-orange`: `#F7941D`
- `--focus-ring`: `#FFFFFF`
- `--color-red-500`: `#FB2C36`
- `--color-amber-300`: `#FFD236`
- `--color-amber-400`: `#FCBB00`
- `--color-green-400`: `#05DF72`
- `--color-blue-400`: `#54A2FF`
- `--color-purple-500`: `#AC4BFF`
- `--color-slate-500`: `#62748E`
- `--color-slate-600`: `#45556C`
- `--color-gray-400`: `#99A1AF`

### Typefaces

- Roboto (`--font-sans`) — on Google Fonts
- Oxygen (`--font-heading`)

### Type scale (most-used sizes)

`56px` · `2.75rem` · `1.5rem` · `1.375rem` · `18px` · `17px` · `16px` · `.9375rem` · `15px` · `14px` · `13px`

### Letter-spacing

`.05em` (5) · `2px` (3)

### Corner radii (most-used)

`2px` · `50%` · `.25rem` · `4px` · `6px` · `3px`

### Shadows

- `none!important`

### Gradients

- `linear-gradient(in lab, red, red)`
- `linear-gradient(#000 50%,#0000)`
- `linear-gradient(90deg,#0000 25%,#000 60%)`
- `linear-gradient(#ffffff59,#ffffff59)`
- `linear-gradient(270deg,#00000080,#0000)`
- `linear-gradient(90deg,#00000080,#0000)`

### Breakpoints

1160px · 1280px