> ## Documentation Index
> Fetch the complete documentation index at: https://craft-support.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# カード

> ページにカスタムの背景、色、画像、プレビュースタイルを設定して、視覚的に魅力的なカードに変換します。

カードは、ドキュメント内のページを視覚的に区別されたカード状の要素に変えるスタイルオプションです。ページに異なる背景、色、プレビュー、フォーマットを設定することで、魅力的なレイアウトを作成できます。

<Frame>
  <video autoPlay muted loop playsInline>
    <source src="https://mintcdn.com/craft-support/vpN4ZHWkgajNnWaJ/images/write-and-edit/styling/cards/en/content/cards-example.mp4?fit=max&auto=format&n=vpN4ZHWkgajNnWaJ&q=85&s=86912a7f01babf1ea8be8506fac76c31" type="video/mp4" data-path="images/write-and-edit/styling/cards/en/content/cards-example.mp4" />
  </video>
</Frame>

<Info title="カードとページの違い">
  カードとページは内部的には同じように動作します。カードは、背景・色・プレビュー・フォーマットといった視覚的なスタイルが追加されたページに過ぎません。ページでできることはすべて、カードの中でも行えます。
</Info>

## カードを作成する

<Steps>
  <Step title="スラッシュメニューを開く">
    ドキュメントに `/card` と入力します。
  </Step>

  <Step title="スタイルを選ぶ">
    メニューからカードのスタイルを選択します。
  </Step>

  <Step title="挿入する">
    カードが新しいページブロックとして挿入されます。
  </Step>
</Steps>

詳細は[スラッシュメニューの使い方](/ja/write-and-edit/formatting/slash-menu)をご覧ください。

## 背景

カードは 3 種類の背景でカスタマイズできます:

* **単色:** カラーパレットから選ぶか、カスタムカラーを設定します。

  <img src="https://mintcdn.com/craft-support/L5zMoIm2o8A5WVUD/images/write-and-edit/styling/cards/en/content/card-color.png?fit=max&auto=format&n=L5zMoIm2o8A5WVUD&q=85&s=a0107160a54406d13310ce129db82b00" alt="色付き背景のカード" width="715" height="155" data-path="images/write-and-edit/styling/cards/en/content/card-color.png" />

* **Unsplash の画像:** Craft 内で直接、プロフェッショナルな写真を検索して選択できます。

  <img src="https://mintcdn.com/craft-support/L5zMoIm2o8A5WVUD/images/write-and-edit/styling/cards/en/content/card-image.png?fit=max&auto=format&n=L5zMoIm2o8A5WVUD&q=85&s=4ab390d1e1becd66cf197d5dbd9afb8b" alt="Unsplash 画像を背景にしたカード" width="710" height="156" data-path="images/write-and-edit/styling/cards/en/content/card-image.png" />

* **自分の画像:** 端末から画像をアップロードします。

背景なしのまま、すっきりとミニマルな見た目にすることもできます:

<img src="https://mintcdn.com/craft-support/L5zMoIm2o8A5WVUD/images/write-and-edit/styling/cards/en/content/simple-card.png?fit=max&auto=format&n=L5zMoIm2o8A5WVUD&q=85&s=05efda4938c09f871b022ddd9cade7ef" alt="背景なしのシンプルなカード" width="718" height="162" data-path="images/write-and-edit/styling/cards/en/content/simple-card.png" />

## プレビュースタイル

カードのプレビューは、その内容が親ページ上にどのように表示されるかを決めます。5 つの選択肢があります:

* **標準:** デフォルトのプレビュー。タイトルとカード内容の抜粋を表示します。
* **絵文字:** テキストプレビューの代わりに、最大 4 つの絵文字をカードに表示します。
* **ブック:** 本のページのようなスタイル。
* **付箋:** 黄色いノートのページのようなスタイル。
* **ギャラリー:** テキストプレビューの代わりに、カード内の画像を最大 3 枚並べたコラージュを表示します。

## カードフォーマット

カードには 5 つのフォーマットがあり、ドキュメント内でどれだけ目立たせるかを変えられます。組み合わせて使うことで、階層と視覚的なメリハリを作れます。

<Info title="Craft Plus">
  最も大きい 2 つのカードフォーマットは Craft Plus で利用できます。それ以外の 3 つのフォーマットはすべてのプランで利用できます。
</Info>

## 動画チュートリアル

<iframe src="https://www.youtube-nocookie.com/embed/8vIxMUVTvl8" title="How to use Cards in Craft" className="w-full aspect-video rounded-xl" allowFullScreen />

## 活用シーン

カードは特に次のような場面で便利です:

* **プロジェクト計画:** プロジェクトのフェーズごとに視覚的なセクションを作成します。
* **ナレッジベース:** トピックを視覚的な階層で整理します。
* **会議メモ:** アジェンダ項目や議論のトピックを分けます。
* **コンテンツ企画:** アイデアを視覚的に区別して整理します。

## 関連記事

<Columns cols={2}>
  <Card title="スタイル クイックガイド" href="/ja/write-and-edit/styling/quick-guide">
    すべてのスタイリング機能の総合ガイド
  </Card>

  <Card title="カバー画像" href="/ja/write-and-edit/styling/cover-images">
    ドキュメントのカバー画像をカスタマイズ
  </Card>

  <Card title="ブロックとページ" href="/ja/write-and-edit/blocks-and-pages">
    Craft の基本要素を理解する
  </Card>
</Columns>