# 自作アイコンを使用する方法について

**URL:** <https://forum.onecomme.com/t/topic/2023>\
**Category:** カスタマイズ\
**Tags:** 確認待ち\
**Created:** [2024 年 12 月 10 日午前 3:51 UTC](https://forum.onecomme.com/t/topic/2023 "2024-12-10T03:51:04Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![twist](https://avatars.discourse-cdn.com/v4/letter/t/df705f/32.png) [@twist](https://forum.onecomme.com/u/twist)\
**Post date:** [2024 年 12 月 10 日午前 3:51 UTC](https://forum.onecomme.com/t/topic/2023/1 "2024-12-10T03:51:04Z")

</div>

## 対象

わんコメ / テンプレート

## 利用OS

Windows 10

## 利用バージョン: Windows、わんコメやOBSのバージョン

Windows: 10  
わんコメ： 7.0.1  
OBS: 31.0.0

## PRO版を利用

していない

## 過去ログ確認 ([検索はこちらから](https://forum.onecomme.com/search))

した

## ドキュメント確認 ([公式サイト](https://onecomme.com/docs/faq/))

した

## 内容

以前[こちら](https://forum.onecomme.com/t/topic/1820)で質問した者です。  
設定を誤って消してしまい、Slimのテンプレートを使用して同じようにアイコンを自作のものに変更しようとしたのですが、うまくいきません。

CSSをSlimのIndex.htmlが入っているフォルダ内のStyle.cssに貼り付け、過去ログでのご指摘通りtemplatseフォルダに自作アイコンをniconama-img.png、twitch-img.pngの名前にして入れましたが、htmlとOBSでの両方でアイコンが白い丸になってしまいます。  
画像の場所のURLをC:の部分から指定してみたところ、Index.htmlをブラウザで確認する分には反映されているのですが、OBSで表示させるとアイコンが白丸になってしまいます。

CSSの貼り付け場所が間違っているのか、画像のURLか保存場所が間違っているのか分からなくなってしまったので、再度教えていただきたいです。

---

<div class="post-metadata">

**Author:** ![shinkunoshizuku](https://yyz1.discourse-cdn.com/flex031/user_avatar/forum.onecomme.com/shinkunoshizuku/32/913_2.png) [@shinkunoshizuku](https://forum.onecomme.com/u/shinkunoshizuku)\
**Post date:** [2024 年 12 月 10 日午後 11:19 UTC](https://forum.onecomme.com/t/topic/2023/2 "2024-12-10T23:19:20Z")

</div>

```auto
[data-service="niconama"] .avatar {
    background-image: url(./niconama-img.png);
    background-size: cover;
    width: var(--lcv-avatar-size);
}

[data-service="twitch"] .avatar {
    background-image: url(./twitch-img.png);
    background-size: cover;
    width: var(--lcv-avatar-size);
}
[data-service="niconama"] .avatar img,
[data-service="twitch"] .avatar img {
    display: none;
}

```

以前お話しているこのCSSを適用させる場合、 **カスタマイズしたslimテンプレートと同じフォルダ** に差し替えたい自作アイコンの画像を置く必要があります。

まずは、画像の置き場所をご確認いただけますでしょうか。
