📣

Mattermostのテーマ集

2021/06/19に公開

Mattermost 記事まとめ: https://kaakaa.github.io/blog/tags/mattermost

Mattermost テーマ

Mattermost ではアカウント設定から画面の表示テーマを変更することができます。
ちょっと気分を変えたい時や、複数のインスタンスに参加している場合、自分が今どのインスタンスにいるかを識別しやすくするためにテーマを変えたりするかと思います。

Mattermost はデフォルトで 4 種類のテーマ (Mattermost, Organization, Mattermost Dark, Windows Dark) を選択することができ、さらにカスタムテーマを利用することで自由にカラーを設定できます。

しかし、カスタムカラーを設定する場合、カラーを設定できる箇所が 20 箇所以上もあるため、一からテーマを作成するのはなかなか難儀かと思います。

そこで、今回は Mattermost のテーマを紹介しているサイトをいくつか紹介していきます。

カスタムテーマの設定方法

テーマ紹介サイトを紹介する前に、カスタムテーマの設定方法について紹介します。

カスタムテーマの設定方法は非常に簡単で、Mattermost テーマを表す JSON 文字列をコピーして、アカウント設定のカスタムテーマの部分にペーストするだけです。

custom_theme_settings

ペーストした時点で画面表示が変わるので、問題なさそうなら保存ボタンを押して変更を完了します。

Mattermost テーマを表す JSON 文字列は、下記のような形式をした文字列です。

{
  "sidebarBg": "#146b3a",
  "sidebarText": "#f7f7f7",
  "sidebarUnreadText": "#eba828",
  "sidebarTextHoverBg": "#de161a",
  "sidebarTextActiveBorder": "#175b33",
  "sidebarTextActiveColor": "#ffa900",
  "sidebarHeaderBg": "#175b33",
  "sidebarHeaderTextColor": "#f7f7f7",
  "onlineIndicator": "#21e4a4",
  "awayIndicator": "#eba828",
  "dndIndicator": "#bb2528",
  "mentionBj": "#de161a",
  "mentionColor": "#ffa900",
  "centerChannelBg": "#ffffff",
  "centerChannelColor": "#333333",
  "newMessageSeparator": "#ffa900",
  "linkColor": "#016341",
  "buttonBg": "#1c8c4c",
  "buttonColor": "#ffffff",
  "errorTextColor": "#bb2528",
  "mentionHighlightBg": "#bb2528",
  "mentionHighlightLink": "#ffa900",
  "codeTheme": "solarized-light",
  "mentionBg": "#de161a"
}