Lism CSS
検索

Project Templates

Lism CSSで新しいプロジェクトを始めるための雛形です。CLIの対話選択、またはテンプレートslugの直接指定で生成できます。

クイックスタート

対話形式でカテゴリ、スタック、バリアントを選んで生成します。

 npm create lism@latest

引数を渡すと選択UIをスキップして直接生成できます。

 npm create lism@latest {targetDir} -- --template {slug}

利用できるテンプレート

CLIから直接生成できるテンプレート一覧です。

Minimal

(2)

Lism CSS を導入した最小構成。検証や独自構成のベースに最適です。

Minimal のサムネイル
AstroVite + React

Minimal

Lism CSS を導入した最小構成。検証や独自構成のベースに最適です。

$ npm create lism@latest -- --template minimal --lang ja
詳細を見る Preview

Blog

(3)

Lism CSSで構築したブログサイト用のテンプレート。

Blog Minimal のサムネイル
Astro

Blog Minimal

記事一覧 / 詳細 / Tags のみの最小構成の Astro ブログ

  • タグ
  • sitemap
$ npm create lism@latest -- --template blog-astro-minimal --lang ja
詳細を見る Preview
Blog Personal のサムネイル
Astro

Blog Personal

個人ブログ・エッセイ向け。年月アーカイブつきの落ち着いた Astro ブログ

  • タグ
  • 年月アーカイブ
  • シェアボタン
  • OGP画像自動生成
  • sitemap（lastmod 対応）
$ npm create lism@latest -- --template blog-astro-personal --lang ja
詳細を見る Preview
Blog Tech Log のサムネイル
Astro

Blog Tech Log

技術ブログ向け。コードハイライト・カテゴリ・タグ・TOC・年月アーカイブ・検索を装備した Astro ブログ

  • カテゴリ / タグ
  • 年月アーカイブ
  • 検索（Pagefind）
  • 目次
  • コードハイライト
  • ダークモード
  • シェアボタン
  • OGP画像自動生成
  • sitemap（lastmod 対応）
$ npm create lism@latest -- --template blog-astro-techlog --lang ja
詳細を見る Preview

LP

(2)

Lism CSSで構築したLPページ用のテンプレート。

LP Interior のサムネイル
Astro

LP Interior

インテリア・暮らし系サービス向けの Astro ランディングページ

$ npm create lism@latest -- --template lp-astro-interior --lang ja
詳細を見る Preview

TemplatesとPatternsの違い

Templatesはプロジェクト一式を生成する雛形です。Patternsは既存サイトへコピーして使うセクション単位・パーツ単位のパターン集です。

Patternsを見る