ブレイクポイントとは、レスポンシブデザインを設定するときに、レイアウトが切り替わる画面幅（ピクセル数）の基準値です。サイトを閲覧する画面の幅が、設定したブレイクポイントを超えたり下回ったりした場合、その画面幅に合うデザインが自動的に適用されます。

Studioではブレイクポイントの追加や値の変更ができます。設定はプロジェクト全体で共通となり、ページごとに異なる設定はできません。

ブレイクポイントの切り替えや編集は、主にエディタ下部のツールバーで行います。

Studioでは、デフォルト（PC）を含め5種類のブレイクポイントを設定できます。各ブレイクポイントの仕様は下記の通りです。

※Studio Storeテンプレートから作成するプロジェクトでは、テンプレートデザイナーによりカスタマイズされている場合があります。

表示画面幅が各ブレイクポイントの最大幅を超えると、次に大きいブレイクポイントでのレイアウトが適用されます。PC（デフォルト）の最大値を超えた場合は、その最大値のデザインが適用されます。

初期状態では[デフォルト][タブレット][モバイル]の2つが設定されています。以下の手順で、[スモール][ミニ]の追加が可能です。

各ブレイクポイントの設定値は、ツールバーで数値を入力するか、スクリーン外の縦ラインをドラッグして調整できます。

ブレイクポイントバーをドラッグして調整することも可能です。

[デフォルト]以外のブレイクポイントは削除が可能です。