Wix Harmony エディタ：パーツをデザインする
4分
この記事内
- 色を選択する
- パーツの一部をデザインする
- デザイン用語集
この記事では、2025年12月にリリースされた新 Wix Harmony エディタについて説明します。Wix Harmony エディタは、現在一部のユーザー様のみご利用いただけます。Wix Harmony エディタまたは以前のエディタのどちらを使用しているか不明な場合は、こちらで詳細を確認してください。
「デザイン」パネルを使用すると、パーツのデザインを思い通りにカスタマイズすることができます。色を変更したり、パーツの一部を調整したり、状態ごとに異なるスタイルを設定したりと、サイトの外観や雰囲気に合わせて柔軟にカスタマイズすることができます。
すべてのパーツには独自のデザインオプションがあるため、編集する内容に応じて異なる設定が表示されます。
始めるには：
パーツをクリックし、「All design options（すべてのデザインオプション）」アイコン 
をクリックします。
をクリックします。色を選択する
カラーサークルをクリックして色を選択すると、カラーピッカーが表示されます。ここでは、サイトのブランドカラーと、現在使用しているカスタムカラーを確認することができます。新しい色を選択するには、以下の 3つの方法があります：
- カラースキームのドットを移動させて色を選択する
- 16進数カラーコード（例：黒の場合は #000000 など）を入力する
- 「スポイト」アイコン
をクリックしてページ上のパーツから色を取得する
パーツの一部をデザインする
エディタ内の一部のパーツには詳細なデザインオプションがあり、個々のパーツを個別にデザインすることができます。たとえば、ボタンの場合なら、ボタン自体、アイコン、テキストを個別にカスタマイズすることができます。これにより、ドロップダウンからカスタマイズしたいパーツを選択して、細部を自分好みのスタイルに仕上げることができます。
デザイン用語集
「デザイン」パネル内の各種用語とそれらの定義については、以下の表をご参照ください。
設定 | 項目の定義 |
|---|---|
背景 / 塗りつぶし色  | パーツに塗りつぶし色を追加することができます。「色」のサークルをクリックして、ブランドカラーまたはカスタムカラーを選択することができます。 コンテナやセクションの場合：アクションバーの「背景を変更」をクリックすると、背景色を変更することができます。 |
枠線  | パーツに枠線を追加して目立たせることができます。 枠線全体の色、太さ、スタイルを選択するか、「個々の枠線を編集」アイコン  をクリックして、それぞれの枠線を個別にデザインすることができます。 |
角  | 「半径」下のスライダーをドラッグして、パーツの角の丸みを調整することができます。 「個々の角を編集」アイコン をクリックすると、それぞれの角を個別にデザインすることができます。 |
影  | パーツの内側や外側に影を適用して、パーツが立体的に見えるようにすることができます。 影の位置、ぼかし、サイズ、色・不透明度を調整することもできます。 |
間隔  | パーツまたは選択した領域の周囲の余白を調整して、コンテンツに余白を追加します。 編集する内容によっては、個々の側面を調整したり、垂直方向と水平方向の間隔を調整したりするオプションが表示される場合があります。 |
レイアウト  | レイアウトの設定を調整して、パーツを希望の位置に配置することができます。 編集する内容によっては、「反転」、「配置」、「Set direction（方向を設定）」、または「Fine-tune the size and position（サイズと位置を調整）」などのオプションが表示される場合があります。 |
フォント、太さ、サイズ、色、書式をカスタマイズして、テキストの見た目を変更することができます。 編集する内容によっては、「More text options（その他のテキストオプション）」をクリックできる場合があります。クリックすると、行間隔や大文字・小文字などの追加の設定が表示されます。 |
