簡単な設定
全体設定は不要です： ドックの次の欄から、オプションを1つ選びます： ユーザー名の色（Username colors） のセクション。
- Social Stream Ninja拡張機能またはデスクトップアプリの設定を開きます。
- 次のセクションで： メインチャットオーバーレイと操作ドック（Main chat overlay & control dock）で、次を展開します： ユーザー名の色（Username colors）.
- オンにする項目： 色のない名前の色を生成（Generate colors for uncolored names）。プラットフォームが提供した色を維持し、色がない名前に色を補います。
- 更新されたドックリンクを使用してください。既存のドックやOBSブラウザーソースのURLも、次を追加すると利用できます：
&randomcolorを追加して再読み込みします。
色の動作を選ぶ
結果を予測しやすくするため、主な色オプションは一度に1つ使ってください。
| ドックのオプション | 結果 | 適した用途 |
|---|---|---|
| 色のない名前の色を生成（Generate colors for uncolored names） | プラットフォームが提供した名前の色を維持し、色がない場合に一定の色を割り当てます。 | ほとんどの利用者 |
| すべての名前の色を生成（Generate colors for every name） | すべてのユーザー名に一定の生成色を割り当て、プラットフォームの色を置き換えます。 | すべての名前が色分けされたチャット |
| ソースのユーザー名の色を使用（Use source-provided username colors） | チャットプラットフォームが色を提供する場合にのみ、その色を表示します。 | Twitchなど、ユーザー名の色を提供するプラットフォーム |
生成色は安定しています。ドックはユーザーID、ユーザー名、表示名をハッシュ化し、同じ人が同じ色を使い続けるようにします。送信するペイロードや他の表示先にも色を追加したい場合は、全体の色設定を引き続き利用できます。
nameColor の値。名前がまだ同じ色の場合
- ドックの次の欄で、いずれか1つのオプションが有効になっていることを確認します： ユーザー名の色（Username colors） のセクション。
- ユーザー名の色を提供しないプラットフォームでは、次を選択します： 色のない名前の色を生成（Generate colors for uncolored names）.
- ドックURLに次が含まれることを確認してください：
&color,&randomcolor、または&randomcolorall. - すでに開いていたドックのタブやOBSのブラウザーソースを再読み込みしてください。
- カスタムCSSに、すべての次の要素を同じ色にするルールがないか確認してください：
.hl-nameを同じ色にしていないか確認します。
CSSでさらに調整する
ドック設定、次のURLオプション、またはOBSのカスタムCSSから追加できます： &css= または &b64css= のURLオプション、またはOBSブラウザーソースのカスタムCSSを使用します。次を使ってください： !important を、プラットフォームの名前の色を上書きする場合に使用します。
すべての名前を同じ色にする
.hl-name {
color: #ffd166 !important;
}プラットフォームごとに色を選ぶ
.highlight-chat[data-source-type="youtube"] .hl-name {
color: #ff5a5f !important;
}
.highlight-chat[data-source-type="twitch"] .hl-name {
color: #b794f4 !important;
}
.highlight-chat[data-source-type="kick"] .hl-name {
color: #53fc18 !important;
}モデレーターとVIPを強調する
.highlight-chat.mod .hl-name {
color: #5eead4 !important;
}
.highlight-chat.vip .hl-name {
color: #f472b6 !important;
}CSSではプラットフォームや役割を確実に指定できますが、標準ドックはユーザー名をCSSクラスや属性に追加しません。人ごとに固定の色を設定するには、組み込みの生成色、または次を使用してください： カスタムオーバーレイ でJavaScriptを使い、ユーザー名を色に対応させます。