·elite-layouts
</>

elite-layouts

rshvr/elite-web-design

プレミアムな Web エクスペリエンスのための最新の CSS レイアウト パターン。ベント グリッド、水平スクロール セクション、スティッキー/パララックス レイアウト、コンテナ クエリ、CSS グリッド、非対称レイアウト、雑誌レイアウト、レスポンシブ グリッド システム、スクロール スナップ、またはレイアウトとアニメーションの統合について質問された場合に使用します。

0インストール·0トレンド·@rshvr

インストール

$npx skills add https://github.com/rshvr/elite-web-design --skill elite-layouts

SKILL.md

| Bento Grids | bento-grids.md | | Horizontal Scroll | horizontal-scroll.md | | Sticky & Parallax | sticky-parallax.md | | Container Queries | container-queries.md |

| Portfolio | Bento + Horizontal | Feature work, case studies | | E-commerce | Container queries | Product grids, responsive cards | | Landing page | Sticky parallax | Hero → Features → CTA flow | | Dashboard | Bento + Container | Resizable panels, widgets | | Blog/Magazine | Asymmetric grid | Editorial feel, visual hierarchy |

| Agency | Horizontal + Bento | Immersive, exploratory |

プレミアムな Web エクスペリエンスのための最新の CSS レイアウト パターン。ベント グリッド、水平スクロール セクション、スティッキー/パララックス レイアウト、コンテナ クエリ、CSS グリッド、非対称レイアウト、雑誌レイアウト、レスポンシブ グリッド システム、スクロール スナップ、またはレイアウトとアニメーションの統合について質問された場合に使用します。 ソース: rshvr/elite-web-design。

原文を見る

引用可能な情報

AI/検索での引用用の安定したフィールドとコマンド。

インストールコマンド
npx skills add https://github.com/rshvr/elite-web-design --skill elite-layouts
カテゴリ
</>開発ツール
認証済み
初回登録
2026-02-11
更新日
2026-02-18

クイックアンサー

elite-layouts とは?

プレミアムな Web エクスペリエンスのための最新の CSS レイアウト パターン。ベント グリッド、水平スクロール セクション、スティッキー/パララックス レイアウト、コンテナ クエリ、CSS グリッド、非対称レイアウト、雑誌レイアウト、レスポンシブ グリッド システム、スクロール スナップ、またはレイアウトとアニメーションの統合について質問された場合に使用します。 ソース: rshvr/elite-web-design。

elite-layouts のインストール方法は?

ターミナルまたはコマンドラインツール(Terminal、iTerm、Windows Terminal など)を開きます このコマンドをコピーして実行します: npx skills add https://github.com/rshvr/elite-web-design --skill elite-layouts インストール後、スキルは自動的に AI コーディング環境に設定され、Claude Code や Cursor で使用できるようになります

ソースリポジトリはどこですか?

https://github.com/rshvr/elite-web-design