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

# WieldyAi design system

wieldy.ai

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

Corrections or removal: <agent@clinicalterminal.com>

![WieldyAi homepage](https://firebasestorage.googleapis.com/v0/b/clinical-ai-design.firebasestorage.app/o/snapshots%2Fdesign-systems%2Fthumbs%2F100923933.jpg?alt=media)

## Palette

- Ground

  \#FFFFFF

  \--token-99d43ccf-38bf-4f05-a96e-2e5a9f1ac655

- Ink

  \#272340

- Accent on the ground

  \#464070

- Primary

  \#464070

  \--token-17e6b2d5-a4d6-4e9f-9cf0-77f43fde0d81

- On primary

  \#FFFFFF

  \--token-99d43ccf-38bf-4f05-a96e-2e5a9f1ac655

- Dark

  \#272340

  \--token-9a63a648-7f8e-4755-9eb2-faeee7f09346

- Site background

  \#FFFFFF

  \--token-99d43ccf-38bf-4f05-a96e-2e5a9f1ac655

## Other named colors

- \--token-462b9286-f5e8-4052-82b7-3ee8552b41f5 #E5ECDF
- \--token-a52c025c-2940-41a8-b548-fa61eaca0df2 #E9D7D9
- \--token-9a63a648-7f8e-4755-9eb2-faeee7f09346 #272340
- \--token-17e6b2d5-a4d6-4e9f-9cf0-77f43fde0d81 #464070
- \--token-7e27ae38-78c2-4d39-843e-1083996c2cc0 #8E7DFF
- \--token-140c3a39-6e07-46fe-a12f-4664c89c45c2 #0D0D0D
- \--token-e4d55286-782d-4981-b9a3-507389f7eb98 #383735
- \--token-ff9d655f-95d4-4c4a-86e6-3df29dbf4dcc #4D4D4D
- \--token-747b735e-1117-48b5-af4f-fc681ffa54d9 #F7F7F7
- \--token-99d43ccf-38bf-4f05-a96e-2e5a9f1ac655 #FFFFFF
- \--token-aeef1932-322d-4b9a-b74a-e702324d370d #E3E3E3
- \--token-fe89138c-6839-44eb-9bfb-7b25fcfd8fb2 #000000
- \--token-40c27628-5877-475e-b379-78cb8241ca91 #25233F
- \--token-dd4c4225-43a0-4d07-bc07-837963250031 #1A182C
- \--token-1425d979-f8fb-4fac-bf80-11ade56bb941 #3A3760
- \--token-289494cb-eff5-4168-8844-22d9eeb6e109 #B3B0C6
- \--token-23fcbdc8-d99e-4bd3-a42b-5af31ece649a #EDECF2
- \--token-d081e44e-bbd3-47c6-b990-fc846fd6cd69 #F6F5F9
- \--token-f19ebc7c-ff79-4667-9477-f059cbdb434a #E9D7D9
- \--token-d81da30a-90d0-4146-976b-b6b01e9c7cb8 #5F5D75
- \--token-92f2ef89-dc4b-4c14-8885-5878a0e96c9c #DCDBE4
- \--token-1d0fe32f-f4c5-4482-afdf-edd4cc4e5e38 #FFFFFF

## Type

Headings

IBM Plex Serif

WieldyAi at a glance

Body

Archivo · closest free match for Switzer

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

- 60pxWieldyAi
- 48pxWieldyAi
- 40pxWieldyAi
- 32pxWieldyAi
- 28pxWieldyAi
- 24pxWieldyAi
- 20pxWieldyAi
- 18pxWieldyAi

## Shape & depth

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

### Corner radii

- 20px

  used in 5 rules

- 100%

  used in 2 rules

### Gradients

- linear-gradient(#fff 0%,#ababab00 100%)

  used in 6 rules

- radial-gradient(50% 66% at 45.9% 51.9%,#000 16.5312%,#0000 100%)

  used in 2 rules

- radial-gradient(50% 50%,#45c9c1 39.0625%,#45c9c100 100%)

  used in 1 rule

- radial-gradient(50% 50%,#f480d4 39.0625%,#f480d400 100%)

  used in 1 rule

Breakpoints: 809px · 810px · 1199px · 1200px

## Voice

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

## 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%2F100923933.md?alt=media).

```
---
generator: clinical-terminal-brand-kit
company: "WieldyAi"
domain: "wieldy.ai"
colors:
  primary: "#464070"
  onPrimary: "#FFFFFF"
  dark: "#272340"
  background: "#FFFFFF"
ground:
  mode: light
  hex: "#FFFFFF"
  ink: "#272340"
  accent: "#464070"
fonts:
  heading: "IBM Plex Serif"
  body: "Archivo"
radius:
  card: "8px"
  button: "10px"
---

# Design System — WieldyAi

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

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

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

## Type
- Headlines: **IBM Plex Serif**. Body: **Archivo**. Both on Google Fonts.
- WieldyAi's site uses IBM Plex Serif / Switzer; these are the closest free look-alikes.

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

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

## Tokens from the site's stylesheets

### Other named colors

- `--token-462b9286-f5e8-4052-82b7-3ee8552b41f5`: `#E5ECDF`
- `--token-a52c025c-2940-41a8-b548-fa61eaca0df2`: `#E9D7D9`
- `--token-9a63a648-7f8e-4755-9eb2-faeee7f09346`: `#272340`
- `--token-17e6b2d5-a4d6-4e9f-9cf0-77f43fde0d81`: `#464070`
- `--token-7e27ae38-78c2-4d39-843e-1083996c2cc0`: `#8E7DFF`
- `--token-140c3a39-6e07-46fe-a12f-4664c89c45c2`: `#0D0D0D`
- `--token-e4d55286-782d-4981-b9a3-507389f7eb98`: `#383735`
- `--token-ff9d655f-95d4-4c4a-86e6-3df29dbf4dcc`: `#4D4D4D`
- `--token-747b735e-1117-48b5-af4f-fc681ffa54d9`: `#F7F7F7`
- `--token-99d43ccf-38bf-4f05-a96e-2e5a9f1ac655`: `#FFFFFF`
- `--token-aeef1932-322d-4b9a-b74a-e702324d370d`: `#E3E3E3`
- `--token-fe89138c-6839-44eb-9bfb-7b25fcfd8fb2`: `#000000`
- `--token-40c27628-5877-475e-b379-78cb8241ca91`: `#25233F`
- `--token-dd4c4225-43a0-4d07-bc07-837963250031`: `#1A182C`
- `--token-1425d979-f8fb-4fac-bf80-11ade56bb941`: `#3A3760`
- `--token-289494cb-eff5-4168-8844-22d9eeb6e109`: `#B3B0C6`
- `--token-23fcbdc8-d99e-4bd3-a42b-5af31ece649a`: `#EDECF2`
- `--token-d081e44e-bbd3-47c6-b990-fc846fd6cd69`: `#F6F5F9`
- `--token-f19ebc7c-ff79-4667-9477-f059cbdb434a`: `#E9D7D9`
- `--token-d81da30a-90d0-4146-976b-b6b01e9c7cb8`: `#5F5D75`
- `--token-92f2ef89-dc4b-4c14-8885-5878a0e96c9c`: `#DCDBE4`
- `--token-1d0fe32f-f4c5-4482-afdf-edd4cc4e5e38`: `#FFFFFF`

### Typefaces

- Inter — on Google Fonts
- IBM Plex Serif — on Google Fonts
- Switzer
- Instrument Sans — on Google Fonts
- Fragment Mono
- Instrument Sans Placeholder
- IBM Plex Serif Placeholder
- Inter Placeholder

### Type scale (most-used sizes)

`60px` · `48px` · `40px` · `32px` · `28px` · `24px` · `20px` · `18px` · `16px` · `14px` · `12px`

### Letter-spacing

`-2px` (13)

### Corner radii (most-used)

`20px` · `100%`

### Gradients

- `linear-gradient(#fff 0%,#ababab00 100%)`
- `radial-gradient(50% 66% at 45.9% 51.9%,#000 16.5312%,#0000 100%)`
- `radial-gradient(50% 50%,#45c9c1 39.0625%,#45c9c100 100%)`
- `radial-gradient(50% 50%,#f480d4 39.0625%,#f480d400 100%)`

### Breakpoints

809px · 810px · 1199px · 1200px
```
