Skip to content

Instantly share code, notes, and snippets.

View carlymx's full-sized avatar

CaRLymx carlymx

  • Spain
View GitHub Profile
@carlymx
carlymx / gist:49217850008b2440f7c33370cd189ed1
Last active April 30, 2026 22:20
Notion DESING.md for getdesing.md
# Design System Inspired by Notion
# https://getdesign.md/
# https://www.webreactiva.com/blog/como-usar-design-md
## 1. Visual Theme & Atmosphere
Notion's website embodies the philosophy of the tool itself: a blank canvas that gets out of your way. The design system is built on warm neutrals rather than cold grays, creating a distinctly approachable minimalism that feels like quality paper rather than sterile glass. The page canvas is pure white (`#ffffff`) but the text isn't pure black -- it's a warm near-black (`rgba(0,0,0,0.95)`) that softens the reading experience imperceptibly. The warm gray scale (`#f6f5f4`, `#31302e`, `#615d59`, `#a39e98`) carries subtle yellow-brown undertones, giving the interface a tactile, almost analog warmth.
The custom NotionInter font (a modified Inter) is the backbone of the system. At display sizes (64px), it uses aggressive negative letter-spacing (-2.125px), creating headlines that feel compressed and precise. The weight range is broader than typical systems: 400 for bo