検索

メニュー

引用ブロック 概要

スクリーンショット:引用ブロックの例。グレーの太い縦線が引かれ、その右に「これは引用文の例です。デジタル庁デザインシステムでは、アクセシビリティファーストの原則に基づいて、すべてのユーザーが利用しやすいサービスの提供を目指しています。」という引用文が3行にわたって配置されている。

引用ブロックは段落単位での引用を表し、これ自体も段落となるコンポーネントです。

ユースケース

文献や資料から一部を引用するとき
本文中で他の文献や資料の内容を参照する際、引用部分を明示して提示できます。
法令や規定の条文を示すとき
法律、政令、規則などの条文を本文中に引用して説明する場合に使用します。

注意が必要なケース

本文の見栄えのために引用ブロックを使ってはいけません
引用ブロックには左側に縦線が入って段落がインデントされるという視覚的な特徴がありますが、これは他の文献や資料からの引用を表現するためのものです。コラムのように文脈を切り替えたり、本文を強調したりする目的では使用しないでください。

各種リソース

種別 リソース 状態
デザイン Figmaデザインデータ 提供予定
HTML版実装 ソースコード(GitHub) 提供中
サンプル(Storybook) 提供中
React版実装 ソースコード(GitHub) 提供中
サンプル(Storybook) 提供中