---
title: "スタイルを作る"
slug: "create-a-style"
abstract: "フォームのビジュアルビルダーを使ってスタイルを作成するか、CSSコードを入力してブランドに合ったフォームを効率的に作成できます"
---
# スタイルを作る

フォームでは、ワンクリックでブランドに合ったスタイルを作成できます。

スタイルは2種類作成できます。

-   ビジュアルスタイル - **Stylesビルダー**で作成。
-   CSSスタイル - スタイルをCSSコードとして保存して作成します。

> !注スタイルビルダーを使ってスタイルの作業を始めてから、CSSエディタを開くと、作成したスタイルをCSSコードとしてさらに編集できます。
> 
> ただし、CSSコードの編集を始めた後はビジュアルビルダーでスタイル編集に戻ることはできません。CSSエディターからスタイルビルダーに戻ると、コードで加えたすべての変更が消去されます。

## ビジュアルビルダーを使ってスタイルを作成しましょう

ビジュアルビルダーを使ってスタイルを作成するには:

1.  フォームのトップツールバーで **、「スタイル」** > **「スタイルを追加**」をクリックします。
2.  スタイルの名前を入力し、「 **追加**」をクリックします。
3.  ビジュアルビルダーの左側で、修正したい様々なオプションをクリックしてください。キャンバスの右側でデフォルトスタイルに適用された変更を確認できます。
4.  変更が終わったら、「 **保存**」をクリックします。
5.  または、CSSコードを修正してスタイルを編集するには、「 **Edit style as CSS」**をクリックしてください。

スタイルは保存され、フォームに適用できます。

## CSSエディタを使ってスタイルを作成します

ビジュアルエディターでスタイルを作成するには:

1.  フォームのトップツールバーで **、「スタイル」** > **「スタイルを追加**」をクリックします。
2.  スタイルの名前を入力し、「 **追加**」をクリックします。
3.  CSSエディタを開くには、「 **Edit style as CSS」**をクリックしてください。
4.  既存のCSSコードを修正するか、新しいCSSクラスを入力してください。キャンバスの右側でデフォルトスタイルに適用された変更を確認できます。
5.  変更が終わったら、「 **保存**」をクリックします。

CSSコードとして保存されたスタイルは、その名前に (Code) 付け加えられています。スタイルはフォームに適用できるようになりました。