概要 #
チェックボックス(ボタンスタイル)は、チェック項目をボタンのような見た目で表示できる入力形式です。
従来のチェックボックスよりも視認性や操作性に優れており、選択された状態が視覚的に強調されます。
ユーザーにとって直感的で分かりやすいUIを実現しやすく、選択肢を目立たせたい場合や、選択の状態を強く示したい場面に最適です。
通常のチェックボックスと同様に、複数選択も可能で、アンケートや設問フォームなど幅広く活用できます。
チェックボックス(ボタンスタイル)の設定項目の説明 #
チェックボックスのボタンスタイルは、従来の四角いチェック形式ではなく、ボタン型のUIでON/OFFを切り替える視覚的なインタラクションを提供します。
選択状態が明確に表示されるため、視認性が高く、フォーム全体のデザイン性を高める用途に向いています。
- ① デザイン:
「デザインを選択する」ボタンをクリックすると、さまざまなボタンデザインから選択可能です。
表示スタイルやフォントの有無など、UIの印象に大きく関わる要素です。 - ② カラー選択:
選択状態のボタンカラーを設定できます。カラーパレットで変更するか、16進数カラーコードで指定可能です。
「フォームカラーを使用」をONにすると、フォーム全体の設定カラーに自動で合わせることができます。
ボタンスタイル(チェックボックス)のデザイン選択画面の説明 #
ボタンスタイルのチェックボックスでは、見た目や操作感を重視したデザインが選べます。
デフォルトのチェックボックスに加え、丸みを帯びたボタンやポップなデザインなど、回答の印象に応じたスタイルを選択できます。
- 画面左側:
「すべて」「ボタンスタイル(チェックボックス)」「チェックボックス」など、カテゴリ別にデザインをフィルタリングできます。 - 画面中央:
選択可能なデザインが一覧で表示されます。
クリックで即時プレビューされ、選択されたデザインが適用されます。 - デザイン例:
「07.ボタンスタイル(デフォルト)」では、大きめの丸いボタン形式になっており、選択のON/OFFがひと目で分かります。
「05.ポップスタイル1」では、アイコン付きのカジュアルなスタイルが採用されています。
フォームの雰囲気や利用シーンに応じて、最適なボタンデザインを選択してください。