Quick start

Use CLI

Don't Trust, Verify

Copy patterns

1. Init cli

npx @designervoid/ton-design-system@5.0.2 cli --github

npx @designervoid/ton-design-system@5.0.2 cli --github
Repository cloned successfully.
What do you want to copy?
> project
  component

2. Choose pattern

Select the project to copy:
  README.md
  patterns-raw-library-rust-wasm
  patterns-raw-library-wat
  patterns-react
> patterns-vanjs
  raw-framework
  raw-library

3. Enter new project name (instead of patterns-vanjs)

Enter your project name: copied-patterns-vanjs

4. Wait for install

Project copied successfully.
Detected pnpm!
Lockfile is up to date, resolution step is skipped
Packages: +262
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Progress: resolved 262, reused 262, downloaded 0, added 262, done

dependencies:
+ vanjs-core 1.5.2

devDependencies:
+ @biomejs/biome 1.9.4
+ @rsbuild/core 1.1.3
+ @types/jsdom 21.1.7
+ autoprefixer 10.4.20
+ cssnano 7.0.6
+ jsdom 25.0.1
+ postcss 8.4.49
+ tailwindcss 3.4.15
+ typescript 5.6.3
+ vitest 2.1.5

Done in 2.2s
Cleaning up...
Cleanup complete.

5. Enter copied-patterns-vanjs

cd copied-patterns-vanjs

6. Install @designervoid/ton-design-system

pnpm add @designervoid/ton-design-system@5.0.2

7. Edit tailwind.config.js

const { tdsTheme } = require("../../package/index");

Change to

const { tdsTheme } = require("@designervoid/ton-design-system");

Copy components

npx @designervoid/ton-design-system@5.0.2 cli --github

Init tailwind

npx @designervoid/ton-design-system@5.0.2 cli --tailwind

Init TDS

npx @designervoid/ton-design-system@5.0.2 cli --tondesignsystem