ベントーグリッド

Bento Grid

大きさの違う角丸の四角を、お弁当箱のようにすき間なく並べて情報を見せるレイアウト。

見た目の特徴

• 大きさの違う角丸の箱を敷き詰める
• 1つの箱に1つの話題
• 箱ごとに色や写真を変える
• すき間（溝）は細く均等

色の組み合わせ （押すと色のコードをコピー）

合うフォントの例

InterNoto Sans JP

どこで使われている？

よく見かける場所

Apple の新製品の紹介ページ、個人のポートフォリオ、AIサービスの機能紹介

使うとよい場面

たくさんの機能や特徴を、ひと目で整理して見せたいとき

避けたい場面

長い文章をじっくり読ませるページ

向いているもの

機能紹介ページ、ポートフォリオ、プロフィール

似ている雰囲気と見比べる

AIへの指示文

Webサイト を作るときの指示文です。作るものは右上の「何を作る？」で変えられます。

Webサイトを「ベントーグリッド（Bento Grid）」のデザインで作ってください。

見た目：大きさの違う角丸の四角いカードを、お弁当箱のようにすき間なく格子状に並べ、1つのカードに1つの話題を入れ、カードごとに背景色や写真を変える。すき間は細く均等にする。

特徴：大きさの違う角丸の箱を敷き詰める／1つの箱に1つの話題／箱ごとに色や写真を変える／すき間（溝）は細く均等

色：背景 #F2F2F4、箱 #FFFFFF、黒の箱 #111114、青 #2F6BFF、文字 #1C1C1E
フォントの例：Inter、Noto Sans JP