1
ページエリアでコンテンツをまとめたい場所に Box エレメントをドラッグ＆ドロップします。
2
設定パネルで Color を開き、背景色を設定します。
● Background Color 内のカラースウォッチをクリックします。
● カラーピッカーやスライダーを使って色相、彩度、明度を調整します。
3
Eyedropper を使ってページ上の任意の色を選び、ボックスの背景に適用することもできます。他の要素と色を合わせたり補完したりするのに便利です。
4
ダークモード用の背景色を設定したい場合は Dark Mode タブに切り替え、同じ方法で色を選択して調整します。
5
単色の代わりにメディア背景を設定する場合は、Select Image をクリックしてメディアライブラリを開きます。ファイルを選択すると、その画像がボックスの背景として適用されます。
6
Padding 設定にスクロールします。
● top(上)・bottom(下)・left(左)・right(右)の値を矢印で調整するか、直接数値を入力します。
● パディングはボックス内の余白を制御し、要素が端に寄りすぎないようにして読みやすさを確保します。
7
必要に応じて Anchor ID を入力すると、このボックスへ直接ジャンプするリンクを作成できます。
8
複数の要素を並べたい場合は、Flex Display を有効化します。
9
Flex Settings でレイアウトを制御します。
● Flex Direction（Row または Column）で、要素を横並びか縦並びにします。
● Align Items で、Column レイアウト時の縦方向の整列を調整します。
● Justify Content で、Row レイアウト時の水平方向のスペース配分を調整します。
10
Flex Wrap を No Wrap（1行内に収める）または Wrap（要素を折り返して次の行に配置する）に設定します。最後にプレビューして変更を保存します。
日本語 
English