Clinical Terminal
AboutSign in

Greenway Health design system

greenwayhealth.com

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

Corrections or removal: agent@clinicalterminal.com

Greenway Health homepage

Palette

Color ramps

Color Blue
50
#E6E7E9
200
#B3B6BD
400
#808690
600
#4E5564
700
#343D4E
800
#1B2538
900
#121825
Color Green
50
#DCF5EE
500
#30C69B
800
#18654F
900
#104335
Color Stone
50
#F2EFEB
100
#DCD9D6
200
#C6C4C1
400
#9B9996
600
#6F6E6C
Color Gray
50
#E8E9EA
100
#D2D4D6
200
#BBBEC1
600
#60686E
950
#131516

Other named colors

Type

Headings
Inter

Greenway Health at a glance

Body
Inter

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

Shape & depth

Cards and panels: 2px corners · buttons and chips: 2px.

Corner radii

Shadows

Gradients

Breakpoints: 600px · 640px

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.

---
generator: clinical-terminal-brand-kit
company: "Greenway Health"
domain: "greenwayhealth.com"
colors:
  primary: "#30C69B"
  onPrimary: "#000000"
  dark: "#1B2538"
  accent: "#104335"
  background: "#F2EFEB"
ground:
  mode: light
  hex: "#F2EFEB"
  ink: "#1B2538"
  accent: "#007B55"
fonts:
  heading: "Inter"
  body: "Inter"
radius:
  card: "2px"
  button: "2px"
---

# Design System — Greenway Health

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

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

## Color
- **Accent on the ground: #007B55** (4.62:1), adjusted from Greenway Health's primary #30C69B so it stays readable. Use it for kickers, key numbers and one highlight per screen, not for large fills.
- **Primary #30C69B** for filled shapes (buttons, chips, bars), with #000000 text on it (9.68:1).
- Secondary accent #104335: charts and a second data series only.
- Quote every hex exactly as written above.

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

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

## 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 Blue** (`--color-blue-N`): 50 `#E6E7E9` · 200 `#B3B6BD` · 400 `#808690` · 600 `#4E5564` · 700 `#343D4E` · 800 `#1B2538` · 900 `#121825`
- **Color Green** (`--color-green-N`): 50 `#DCF5EE` · 500 `#30C69B` · 800 `#18654F` · 900 `#104335`
- **Color Stone** (`--color-stone-N`): 50 `#F2EFEB` · 100 `#DCD9D6` · 200 `#C6C4C1` · 400 `#9B9996` · 600 `#6F6E6C`
- **Color Gray** (`--color-gray-N`): 50 `#E8E9EA` · 100 `#D2D4D6` · 200 `#BBBEC1` · 600 `#60686E` · 950 `#131516`

### Other named colors

- `--color-system-white`: `#FFFFFF`
- `--color-white`: `#FFFFFF`
- `--color-black`: `#000000`
- `--color-pink-500`: `#E08BE8`

### Typefaces

- Inter (`--font-sans`) — on Google Fonts

### Type scale (most-used sizes)

`.8rem`

### Corner radii (most-used)

`5px` · `50%` · `.25rem`

### Shadows

- `none !important`

### Gradients

- `linear-gradient(in lab, red, red)`
- `radial-gradient(circle,#30c69b 0 52%,rgba(0,0,0,0) 58%)`
- `radial-gradient(circle,red 0 52%,rgba(0,0,0,0) 58%)`
- `linear-gradient(270deg,rgba(0,0,0,.5),rgba(0,0,0,0))`
- `linear-gradient(90deg,rgba(0,0,0,.5),rgba(0,0,0,0))`
- `linear-gradient(rgba(0,0,0,0),rgba(0,0,0,.5))`

### Breakpoints

600px · 640px