AIと人のための
CSS設計
フレームワーク
軽量でビルド不要。どのサイトにも導入できます。
あなたはもう、CSS設計に悩む必要はありません。
FEATURES
洗練された設計理論
レイアウトモジュール
Stack, Flex, Grid, Columns など、よく使うレイアウトパターンをモジュール化。組み合わせるだけでサイトの骨組みが完成します。
ハーモニックスケール
余白・フォントサイズ・行間を調和的な比率で設計。自然と心地よいリズムをデザインに生み出すタイポグラフィ設計です。
デザイントークン
カラー・フォントサイズ・余白・角丸・シャドウなどを段階的なCSS変数で一元管理。サイト全体の一貫性を保ちます。
Property Class
-fz:l, -p:20 のような直感的なクラス名で素早くスタイリング可能。形式が明確で短縮記法なのにAIが迷いません。
CSSレイヤー構造
@layer による 厳格なCSSレイヤー設計。詳細度の衝突を防ぎ、拡張性と保守性を両立します。
レスポンシブ
CSS変数とクラスを組み合わせた独自のレスポンシブ手法。軽量なのに柔軟で幅広いレイアウトに対応できます。
ECOSYSTEM
充実のエコシステム
Skills
AIエージェント向けの実装ガイドスキルを用意しています。AIが Lism CSS の設計を理解し、ベストプラクティスに従ったコードを生成します。
MCPサーバー
Claude Code や Cursor 等のAIコーディングツールに Lism CSSの仕様を提供。AIと協力して効率的にサイトを構築できます。
UIコンポーネント
Accordion, Modal, Tabs, Button 等のインタラクティブUIを React / Astro で提供。CLIコマンドでプロジェクトに追加できます。
Templates
すぐに使えるページテンプレート集。ランディングページやブログなど、実用的なレイアウトパーツをコピーしてすぐに始められます。
どこでも使えます
Lism CSSは、CSSファイルを一つ読み込むだけでも導入できます。