Sandlada

A New Frontier forOpenSource libraries

Sandlada is an open-source team building Material Design 3 UI libraries, TypeScript utilities, and VSCode, Zed and OpenCode themes.
View on GitHub

Building interfaces

Generate vibrant UIs, from component behaviors to intricate design tokens.

Explore

Simulating logic

Type-safe utilities, from Result handling to reactive breakpoint observers.

Explore

Producing themes

Conjure light, dark and OLED worlds across VSCode, Zed and OpenCode.

Explore

Exploring color

Transcend static palettes with dynamic schemes, MCU engine and theme CLI.

Explore

Explore the latest  1 / 4

Sandlada is a general-purpose open-source team. It uses simple Material Design 3 tokens to generate photorealistic interfaces that can be explored in real time.

Modelling the interface

Experience the component world from tokens to surface — or witness dynamic color up close.

MDC material component specimens on a green tonal background

@sandlada/mdc

MDC

An open source component library that follows the Material Design 3 design specifications.

GitHubNPM
Glowing style braces for the Material Design CSS token package

@sandlada/material-design-css

Material Design CSS

A CSS package for Material Design tokens: Color, Palette, Motion, Shape, Spacing, Typography and prebuilt themes.

GitHubNPM
Glowing shape and data nodes for the MDK data library

@sandlada/mdk

MDK

A JavaScript library based on Material Design 3, providing data such as color, shape, shadow level, etc.

GitHubNPM

Simulating logic

Generate vibrant ecosystems, from error handling to reactive state.

Glowing check ring for the Result error-handling library

@sandlada/result

Result

A TypeScript library implementing the Result pattern, type-safe and exception-free error handling.

GitHubNPM
Glowing ascending bars for the Breakpoint observer library

@sandlada/breakpoint

Breakpoint

Responsive viewport and element breakpoint observer, MD3 defaults, RxJS, zero-framework.

GitHubNPM
Glowing anchored document node for the Document Context library

@sandlada/document-context

Document Context

A function-first, DOM-anchored IoC container and reactive state management library for browsers.

GitHubNPM
Glowing dynamic color token ring for the MCU Helper engine

@sandlada/mcu-helper

MCU Helper

High-performance functional engine for Material Design 3 color tokens, dynamic schemes and OLED dark themes.

GitHubNPM
Glowing terminal prompt for the Material Theme CLI

@sandlada/material-theme-cli

Material Theme CLI

Material Design CLI for generating theme tokens and serialized color outputs from a source color.

GitHubNPM

Producing themes and fiction

Conjure imaginary worlds, light and dark scenarios across editors.

Glowing frosted editor window for the VSCode Material theme

vscode-material-design-theme

VSCode Material Theme

Material Design 3 theme for VSCode.

GitHub
Glowing terminal cell grid for the OpenCode Material theme

@sandlada/opencode-material-theme

OpenCode Material Theme

Material Design 3 themes for the OpenCode TUI, 194 static JSON themes across 9 variants.

GitHubNPM
Glowing double chevron for the Zed Material theme

@sandlada/zed-material-theme

Zed Material Theme

Material Design 3 themes for Zed, Light, Dark and OLED across 9 variants.

GitHubNPM
Glowing code brackets for the Material VSCode snippet extensions

material-vscode-extensions

Material VSCode Extensions

VSCode snippets: Material Web Snippets and Material Design CSS Snippets.

GitHub

Principles

Material-native

Tokens first. Every library follows Material Design 3 specs for color, shape, motion and typography.

Type-safe

TypeScript by default, exception-free APIs and framework-agnostic cores that stay portable.

Responsibility

Open source from day one. MIT licensed, documented, and built to amplify developer creativity while limiting unintended impact.