Skip to content

activetwist/jsonm

Repository files navigation

JSONM — Portable Design-System Grammar

JSONM is a portable design-system grammar. A JSONM payload describes a brand / design-system as a strictly-validated JSON document — governed tokens, fixed font roles, WCAG-aware semantic colors, mode-keyed appearances — applicable across any application that implements the spec.

A JSONM payload authored once is applicable everywhere, not necessarily with identical rendered output but with the same brand intent. Per-target variance is expressed through transpiler targets, not through schema branching.

Status

JSONM is an early public specification with reference implementations, adapters, conformance fixtures, and examples included in this repository. The v1 style-definition contract is stable; package releases and framework adapters may remain experimental while adoption feedback is incorporated.

Maintainers

JSONM was created by Stanton Brooks and is owned, maintained, and stewarded by Active Twist.

Contents

Path What
spec/v1.md Canonical JSONM v1 specification (Apache-2.0)
schema/ JSON Schema 2020-12 for v1
maps/token-map.json Reference CSS-custom-property token map
examples/ Reference baseline + 10 packaged archetypes
reference/php/ Reference PHP implementation (Apache-2.0)
packages/core/ Experimental TypeScript compiler helpers
packages/tailwind/ Experimental JSONM-to-Tailwind adapter
packages/storybook/ Experimental Storybook theme adapter
examples/storybook/ JMD Storybook showcase for live JSONM theme switching
examples/tailwind/ Tailwind v4 example consuming JSONM variables
conformance/php/CssCustomProperties/ Byte-identical golden outputs for the bundled CSS transpiler target
INTEGRATION.md Adoption guide for consuming applications

Use The Reference Implementations

PHP reference implementation:

cd reference/php
composer install
php tests/ValidatorTest.php
php tests/CssCustomPropertiesTargetTest.php

Other languages: see INTEGRATION.md §7.

JavaScript / TypeScript:

npm install
npm test
npm run storybook
npm run build-storybook

The TypeScript packages are currently workspace packages intended for reference adapter development and examples, not published npm packages.

Composer and npm package names are part of the repository metadata, but registry publication is not the canonical adoption path yet. Use the specification, schemas, reference source, and conformance fixtures in this repository as the current public artifact.

JMD Storybook Showcase

JMD means JSONM Mutable Design. It is the reference Storybook showcase for the JSONM promise: one portable design-system payload can change a representative component environment without changing component source code.

Run it locally:

npm run storybook

Then open http://localhost:6006/ and start with JMD/Control Room. The showcase includes all packaged archetypes, light/dark mode switching, a paste-and-apply JSONM path, foundations, token inspection, and a compact wall of primitives/components/patterns.

Support And Requests

Use GitHub Issues for spec defects, documentation defects, and reference implementation bug reports. Use GitHub Discussions for questions, comments, and change requests.

Active Twist is not accepting unsolicited pull requests or operating an external contributor workflow for JSONM at this stage. See SUPPORT.md.

License

Copyright 2026 Active Twist.

JSONM is released under Apache-2.0. See LICENSE.

The Apache-2.0 license does not grant permission to use the trade names, trademarks, service marks, or product names of Active Twist except as required to describe the origin of the work.