> ## Documentation Index
> Fetch the complete documentation index at: https://help.mosh.jp/llms.txt
> Use this file to discover all available pages before exploring further.

# LP単位で色パレットを保存する

> ページビルダーでLP単位によく使う色をパレットに保存して素早く呼び出す方法を説明します。

この記事では、色パレットの保存・活用方法をご案内します。

<Frame>
  <img src="https://images.spr.so/cdn-cgi/imagedelivery/j42No7y-dcokJuNgXeA0ig/fcfe26d3-d1cb-48aa-a275-2829b9e72984/image/w=1920,quality=90,fit=scale-down" />
</Frame>

## 色パレットとは？

* LP単位で、よく使う色を最大18色までパレットに保存できます。
* パレットに登録した色はカラーピッカーから即座に呼び出し・選択できます。
* LPを複製した場合、色パレットもあわせて複製されます。
* 既存のカラーピッカーの操作はそのまま利用できます。

## 操作方法

<Info>
  **アクセス経路**

  [ログイン](https://mosh.jp/authentication/login?openExternalBrowser=1) → メニュー → ページビルダー → 対象LPの編集 → カラーピッカーを開く
</Info>

<Steps>
  <Step title="カラーピッカーで色を選択する">
    <div style={{display: 'flex', gap: '24px', alignItems: 'flex-start', flexWrap: 'wrap'}}>
      <div style={{flex: '1 1 200px'}}>
        パーツまたはセクションの設定パネルからカラーピッカーを開いて、パレットに保存したい色を選択してください。
      </div>

      <Frame>
        <img src="https://images.spr.so/cdn-cgi/imagedelivery/j42No7y-dcokJuNgXeA0ig/ee06aa58-0e60-4bac-b21e-d13d92c303af/image/w=1920,quality=90,fit=scale-down" style={{width: '240px', flexShrink: 0}} />
      </Frame>
    </div>
  </Step>

  <Step title="色パレットに色を保存する">
    <div style={{display: 'flex', gap: '24px', alignItems: 'flex-start', flexWrap: 'wrap'}}>
      <div style={{flex: '1 1 200px'}}>
        カラーピッカー内の色パレットの「＋追加」ボタンを押すと、現在選択中の色がパレットに追加されます。1LPにつき最大18色まで保存できます。
      </div>

      <Frame>
        <img src="https://images.spr.so/cdn-cgi/imagedelivery/j42No7y-dcokJuNgXeA0ig/12a4b440-1585-4053-a256-2fb00f5bc25e/image/w=1920,quality=90,fit=scale-down" style={{width: '240px', flexShrink: 0}} />
      </Frame>
    </div>
  </Step>

  <Step title="パレットから色を呼び出す">
    カラーピッカーを開くとパレットに保存された色一覧が表示されます。使用したい色をクリックするだけで即座に適用できます。

    <Frame>
      <img src="https://images.spr.so/cdn-cgi/imagedelivery/j42No7y-dcokJuNgXeA0ig/1ced289d-6946-4268-b4fb-6e212cf446e0/image/w=1920,quality=90,fit=scale-down" />
    </Frame>
  </Step>
</Steps>
