MURI

DESIGN.md

---
version: alpha
name: MURI
colors:
  primary: "#000000"
  neutral-2: "#FFFFFF"
  neutral-3: "#1C65AD"
  neutral-4: "#0071CE"
  neutral-5: "#1C1C1C"
  background: "#F5F5F2"
typography:
  display:
    fontFamily: "Heading Font"
    fontWeight: 500
  body:
    fontFamily: "Base Font"
    fontWeight: 400
  mono:
    fontFamily: "Frida Mono"
spacing:
  sm: 4px
  md: 8px
  lg: 16px
  xl: 20px
  2xl: 100px
components:
  button-primary:
    backgroundColor: "#000000"
    textColor: "#f5f5f2"
    rounded: 4px
    padding: "8px 16px"
    fontWeight: 400
  button-2:
    backgroundColor: transparent
    textColor: "#000000"
    rounded: 4px
    padding: "8px 16px"
    fontWeight: 400
  button-3:
    backgroundColor: transparent
    textColor: "#000000"
    rounded: 0px
    padding: "0px 0px"
    fontWeight: 500
---

## Colors

- **primary (#000000):** primary role.
- **neutral-2 (#FFFFFF):** neutral role.
- **neutral-3 (#1C65AD):** neutral role.
- **neutral-4 (#0071CE):** neutral role.
- **neutral-5 (#1C1C1C):** neutral role.
- **background (#F5F5F2):** surface role.

## Typography

- **Frida Mono:** frida_mono
- **Transcript Mono Pro:** transcript_mono_pro
- **Heading Font:** heading_font (weights: 500)
- **Base Font:** base_font (weights: 400)
- **Interactive Font:** interactive_font (weights: 700)
- **GTStandard-M:** gtstandard_m

## Layout

- Spacing scale: 4, 8, 16, 20, 100 px

## Elevation & Depth

- `rgba(0, 0, 0, 0.05) 0px 0px 25px 0px`

## Components

- **button-primary:** background #000000, text #f5f5f2, radius 4px
- **button-2:** background transparent, text #000000, radius 4px
- **button-3:** background transparent, text #000000, radius 0px