はじめに

Jumpu UI はユーティリティフレンドリーなデザインシステムです。

公開しているツール

Jumpu UI を使うためのいくつかのツールを公開しています。

Figma

Figma デザインファイルを Figma Community で公開しています。Figma での UI デザインに Jumpu UI を使うことができます。

Tailwind CSS Plugin

npm パッケージを @jumpu-ui/tailwindcss として公開しています。Tailwind CSS を導入しているプロジェクトで Jumpu UI を使うことができます。

ドキュメントの読み方

Principles — Jumpu UI が何を大事にして設計されているか。コンポーネントの選び方に迷ったときの判断基準です
Tokens — 色、余白、角丸、文字サイズ、相互作用の尺度。自分の UI を組み立てるときにも参照できます
Components — 各コンポーネントの使いどころ、マークアップ規約、アクセシビリティ
Recipes — 場面ごとの組み立て方