monday.com

DESIGN.md

---
version: alpha
name: monday.com
colors:
  neutral-1: "#FF00D9"
  neutral-2: "#FFA600"
  neutral-3: "#595AD4"
  primary: "#6161FF"
  neutral-5: "#9B59FF"
  background: "#FFFFFF"
  text: "#000000"
typography:
  display:
    fontFamily: Poppins
    fontWeight: 400
spacing:
  sm: 8px
  md: 16px
  lg: 28px
  xl: 48px
  2xl: 64px
components:
  button-primary:
    backgroundColor: "#6161ff"
    textColor: "#ffffff"
    rounded: 160px
    padding: "14px 32px"
    fontWeight: 400
  button-2:
    backgroundColor: "#ffffff"
    textColor: "#222222"
    rounded: 26px
    padding: "14px 32px"
    fontWeight: 400
  button-3:
    backgroundColor: transparent
    textColor: "#000000"
    rounded: 0px
    padding: "0px 0px"
    fontWeight: 400
---

## Colors

- **neutral-1 (#FF00D9):** neutral role.
- **neutral-2 (#FFA600):** neutral role.
- **neutral-3 (#595AD4):** neutral role.
- **primary (#6161FF):** primary role.
- **neutral-5 (#9B59FF):** neutral role.
- **background (#FFFFFF):** surface role.
- **text (#000000):** text role.

## Typography

- **Poppins:** poppins (weights: 400)

## Layout

- Spacing scale: 8, 16, 28, 48, 64 px

## Elevation & Depth

- `rgba(0, 0, 0, 0.1) 0px 2px 7px 0px`
- `rgba(0, 0, 0, 0.08) 0px 12px 12px 0px`
- `rgba(0, 0, 0, 0.1) 0px 10px 40px 0px`
- `rgba(29, 140, 242, 0.08) 0px 4px 4px 0px inset`

## Components

- **button-primary:** background #6161ff, text #ffffff, radius 160px
- **button-2:** background #ffffff, text #222222, radius 26px
- **button-3:** background transparent, text #000000, radius 0px