# コレクションリストの画像が少し暗い

**URL:** <https://community.shopify.com/t/topic/68537>\
**Category:** 技術的なQ＆A\
**Created:** [September 28, 2021, 11:43am UTC](https://community.shopify.com/t/topic/68537 "2021-09-28T11:43:33Z")\
**Posts on this page:** 3\
**Page:** 1

## AI-generated summary

主題: Shopify「Debut」テーマで、トップのコレクションリスト画像だけが他より暗く表示される問題。

背景/原因: 画像上のテキスト可読性を高めるため、CSSの擬似要素::beforeで半透明の色（暗いオーバーレイ）が敷かれている設計。

技術的詳細: 対象は「Assets/theme.scss」にある .collection-grid-item__title-wrapper::before のルール（背景色 #685f58 と opacity: 0.34）。テーマのバージョンにより記述場所は異なる可能性あり。

対処法: 上記CSSルールを削除またはコメントアウトすると、コレクションリスト画像が他の画像と同じ明るさになる。

結果/現状: 提案どおりの修正で問題は解決。質問者が動作確認済み。未解決の論点はなし。

<div class="post-metadata">

**Author:** ![smilebb](https://avatars.discourse-cdn.com/v4/letter/s/a4c791/32.png) [@smilebb](https://community.shopify.com/u/smilebb)\
**Post date:** [September 28, 2021, 11:43am UTC](https://community.shopify.com/t/topic/68537/1 "2021-09-28T11:43:33Z")

</div>

現在DEBUTにてトップページを作成していますが、コレクションリストの画像だけ他より少し暗く表示されます。

他と同じ明るさで表示するにはどうしたらよいか分かる方いらっしゃればぜひ教えてください。

---

<div class="post-metadata">

**Author:** ![mrtc](https://yyz1.discourse-cdn.com/shopifyforum/user_avatar/community.shopify.com/mrtc/32/109726_2.png) [@mrtc](https://community.shopify.com/u/mrtc)\
**Post date:** [September 29, 2021, 6:06am UTC](https://community.shopify.com/t/topic/68537/2 "2021-09-29T06:06:21Z")

</div>

Debutのコレクションリストというのはこれのことですよね？  
[https://debut-theme-default.myshopify.com/collections](https://debut-theme-default.myshopify.com/collections)

画像と重なってるテキストを読みやすくするためのデザインだと思います。

テーマのバージョンによって異なるかもしれませんが、現バージョンの場合は「Assets/theme.scss」に書いてある以下のCSSを削除、またはコメントアウトすれば他と同じになります。

```css
.collection-grid-item__title-wrapper::before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: #685f58;
  opacity: 0.34; }

```

---

<div class="post-metadata">

**Author:** ![smilebb](https://avatars.discourse-cdn.com/v4/letter/s/a4c791/32.png) [@smilebb](https://community.shopify.com/u/smilebb)\
**Post date:** [September 30, 2021, 10:34am UTC](https://community.shopify.com/t/topic/68537/3 "2021-09-30T10:34:08Z")

</div>

早速の返信ありがとうございます！

簡単にできました、丁寧にありがとうございます(^^