カードは、ガラス デザイン システムの基本的な構成要素です。
バリアント (Variants)
variant プロパティを通じて複数のカード スタイルをサポートしています。
| バリアント | 説明 | 視覚的スタイル |
|---|---|---|
glass | 標準のすりガラス効果 | ぼかし + 境界線 |
solid | 不透明な背景 | 高コントラスト |
outline | 境界線のみ | ミニマリスト |
ライブ使用例
ガラス カード (Glass Card)
ぼかしと控えめな境界線を備えた、標準のすりガラス効果です。
ソリッド カード (Solid Card)
コントラストを高める不透明な背景です。
アウトライン カード (Outline Card)
境界線のみで作られたミニマリストなスタイルです。
コードの使用法
<Card variant="glass" className="p-6"> <h3>ガラス カード (Glass Card)</h3> <p>これにより、美しい奥行き効果が生まれます。</p></Card>