AI Skills（AI に書き方を教える）

AI Skills は、AI のコーディングツールに「Lism CSS ではこう書く」という決まりを教えるための説明書です。SKILL.md というファイルをプロジェクトに置いておくと、AI がそれを読んで、Lism の考え方・Props・トークン・名前の付け方に沿ったコードを書きやすくなります。

スキルってなに？#

スキルは、AI のツールが必要なときに読む「手順書のフォルダ」です。中心になるのは SKILL.md という Markdown のファイルで、何のためのスキルか、どう書けばよいかが書いてあります。AI は作業の内容に合うスキルを見つけると、その中身を読んでから作業します。

配られているスキル#

Lism CSS が配っているスキルは3つです。

中身は GitHub の lism-css-guide・lism-css-refactor・lism-mockup-guide で読めます。

入れ方は3通り#

どれを使っても、同じスキルが入ります。

skills.sh で入れる#

skills.sh の道具を使います。使っているパッケージの管理ツールに合わせて、どれか1つを実行します。

npx skills add lism-css/core
pnpm dlx skills add lism-css/core
yarn dlx skills add lism-css/core
bunx skills add lism-css/core

gh コマンドで入れる#

GitHub CLI を入れているなら、gh skill install で1つずつ入れられます。

gh skill install lism-css/core lism-css-guide@main
gh skill install lism-css/core lism-css-refactor@main
gh skill install lism-css/core lism-mockup-guide@main

lism-cli で入れる#

Lism の道具 lism-cli の skill add でも入れられます。置けるのはプロジェクトのいちばん上のフォルダだけですが、あとで skill check を使って、GitHub にある新しい版との違いを調べられます。スキル名を書かずに実行すると、3つとも入ります。

npx lism-cli skill add
pnpm dlx lism-cli skill add
yarn dlx lism-cli skill add
bunx lism-cli skill add

そのまま実行すると、質問に答えながら進める形（対話モード）になります。プロジェクトに .claude/ や .cursor/ などのフォルダがあれば、そのツールに最初から印が付いた状態で選べます。

質問なしで決めたいときは、ツールの名前をフラグ（-- で始まる指定）で渡します。

# 1つのツールに置く（スキル名を書かなければ3つとも）
npx lism-cli skill add --claude

# いくつかのツールに同時に置く
npx lism-cli skill add --claude --cursor

# 全部のツールに置く
npx lism-cli skill add --all

# 1つのスキルだけを置く
npx lism-cli skill add lism-css-refactor --claude

フラグと置き場所#

lism-css-guide の場合の置き場所です。ほかのスキルでは、最後のフォルダ名だけが変わります（例：.claude/skills/lism-css-refactor）。

新しい版にする#

まず skill check で、手元のファイルと GitHub の最新のファイルの違いを見ます。置いたファイルを1つずつ sha256（ファイルの中身から作る指紋のような値）で比べ、変わった・増えた・消えたファイルをまとめて出します。違いを確かめてから、skill update で上書きします。

npx lism-cli skill check
npx lism-cli skill update --claude

最新の中身は、GitHub の リポジトリ でも直接見られます。

関連するページ#

• MCP サーバー
• 名前のルール（省略のしかた）
• Lism Props（コンポーネントの指定）