# 【カートに追加する】ボタンの色変更（Dawn）

**URL:** <https://community.shopify.com/t/dawn/206047>\
**Category:** 技術的なQ＆A\
**Tags:** css\
**Created:** [April 6, 2023, 12:39am UTC](https://community.shopify.com/t/dawn/206047 "2023-04-06T00:39:20Z")\
**Posts on this page:** 3\
**Page:** 1

## AI-generated summary

Dawnテーマで【カートに追加する】ボタンの色を変更する方法についての質問と解決。

**質問内容:**
- ECサイトごとに異なる色（楽天は赤、Amazonは黄、ZOZOは青など）にボタンを変更したい
- アプリを使わずに実装したい

**解決方法:**
1. テーマの「コードを編集」を開く
2. 「アセット」フォルダ内の「base.css」を選択
3. ファイルの最下部に以下のCSSコードを追加:
```css
.product-form__submit {
  background-color: red;
}
```
- `red`の部分を任意の色に変更可能

**結果:**
質問者は無事にボタンの色変更に成功し、解決済み。テキストカラーの変更方法についても追加で質問したが、基本的な問題は解決した。

<div class="post-metadata">

**Author:** ![ncm\_fujii](https://avatars.discourse-cdn.com/v4/letter/n/f9ae1b/32.png) [@ncm\_fujii](https://community.shopify.com/u/ncm_fujii)\
**Post date:** [April 6, 2023, 12:39am UTC](https://community.shopify.com/t/dawn/206047/1 "2023-04-06T00:39:20Z")

</div>

初投稿の為、不備がありましたらご容赦ください。

テーマはDawnを使用しております。

【カートに追加する】ボタンの色を変更したいです。

(例) 楽天の場合 赤

ZOZOの場合 青

Amazonの場合 黄

アプリを使用せずに検討しております。

お手数なのですが、ご教示いただけますと幸いです。  
何卒よろしくお願いいたします。

---

<div class="post-metadata">

**Author:** ![Anonymous\_44fbe07fc59d9ccaacd70575fd5a5155](https://yyz1.discourse-cdn.com/shopifyforum/user_avatar/community.shopify.com/anonymous_44fbe07fc59d9ccaacd70575fd5a5155/32/194200_2.png) [@Anonymous\_44fbe07fc59d9ccaacd70575fd5a5155](https://community.shopify.com/u/Anonymous_44fbe07fc59d9ccaacd70575fd5a5155)\
**Post date:** [April 6, 2023, 8:51am UTC](https://community.shopify.com/t/dawn/206047/2 "2023-04-06T08:51:39Z")

</div>

Ncm\_fujii 様

お世話になっております。

フルバランスの道家と申します。

ご質問確認しました。

1. テーマの[コードを編集]をクリック

2.[アセット]フォルダの[base.css]を開く

3.[base.css]の一番下に以下のコードを入れて見てください。

※ redの部分を変えれば、他の色に変わります。

```css
.product-form__submit {
  background-color: red;
}

```

なにかヒントになれば幸いです。

私たちの励みにもなりますので、

お役に立てていればBest Answerボタンを押して頂ければ嬉しいです。

フルバランス 道家

---

<div class="post-metadata">

**Author:** ![ncm\_fujii](https://avatars.discourse-cdn.com/v4/letter/n/f9ae1b/32.png) [@ncm\_fujii](https://community.shopify.com/u/ncm_fujii)\
**Post date:** [April 6, 2023, 9:21am UTC](https://community.shopify.com/t/dawn/206047/3 "2023-04-06T09:21:49Z")

</div>

フルバランス 道家様

ご返信いただきありがとうございます。

ボタンのカラー変更できました。

分かりやすく大変助かりました。

続けてで申し訳ございませんが、ボタンのテキストのカラーの変更もご教示いただけますと幸いです。