Skip to content

DTIF-powered, design-system-aware linter for JavaScript, TypeScript, and CSS: validating tokens and components to keep every interface consistent.

License

Notifications You must be signed in to change notification settings

bylapidist/design-lint

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

@lapidist/design-lint

npm version build license

@lapidist/design-lint keeps JavaScript, TypeScript and style sheets aligned with your design system. It validates design tokens, flags unsupported components and offers rich formatting options for continuous integration pipelines. The linter operates solely on the Design Token Interchange Format (DTIF), using the canonical parser and schema as its reference implementation.

This project is not ready for production use.

Quick start

@lapidist/design-lint requires Node.js ≥22. The commands below either run the linter once via npx or install it locally, initialise configuration, and lint your src directory. For deeper CLI details, see the Usage guide.

# run without installing
npx @lapidist/design-lint@latest src

# or add to your project
npm install --save-dev @lapidist/design-lint
npx design-lint init
npx design-lint src

See the Usage guide for the full command reference.

Why design-lint?

General purpose linters understand code style, not design systems. @lapidist/design-lint bridges that gap by enforcing token usage and component conventions across your codebase.

Token awareness

@lapidist/design-lint flags raw values that bypass design tokens, keeping colour, spacing and typography consistent. Learn more in the rule reference.

Auto-fixes

Run with --fix to automatically replace deprecated tokens or components and tidy up your code. See the usage guide for fix options.

Broad language support

Lint JavaScript, TypeScript, CSS, SCSS, Sass and Less, including inline styles and tagged template literals.

Extensible

Extend behaviour with custom rules, formatters, and token transforms for your design system.

Advantage @lapidist/design-lint Generic linters
Design token validation
Component deprecation warnings
Multi-language style + code linting ⚠️ (varies)

For more background, read the introductory blog post.

Documentation

The complete documentation is available under the docs/ directory and on design-lint.lapidist.net. See docs/index.md for the documentation landing page.

Document Purpose
Usage Explains CLI flags, watch mode and caching.
Configuration Details tokens, rule levels and plugin activation.
Rules Provides a rule reference grouped by category.
Formatters Describes built-in and custom output formats.
CI Includes examples for GitHub Actions and other providers.
API Shows programmatic usage with TypeScript types.
Architecture Explains how the linter works internally.

Contributing

Contributions are welcome. Please read CONTRIBUTING.md and follow the Code of Conduct.

License

MIT

About

DTIF-powered, design-system-aware linter for JavaScript, TypeScript, and CSS: validating tokens and components to keep every interface consistent.

Topics

Resources

License

Code of conduct

Contributing

Security policy

Stars

Watchers

Forks

Contributors 5