高度なブランディング

  • 更新

Biz_Enter.png

御社で詳細なブランディングが利用可能になった後、ブランディングするイベントのダッシュボードに移動して、[設定] > [テーマ]の順に選択し、[詳細設定を表示]をクリックします。

組織でディープブランディングが利用可能になったら、ブランド化したいイベントのダッシュボードに移動し、[設定] > [テーマ]を選択してプライマリカラーを設定し、[保存]をクリックします。 その後、[詳細設定を表示]を選択すると、カスタマイズ用の追加オプションが開きます。

注:プライマリカラーを設定しないと、他の設定は機能しません。

theme.png

以下から、色の変更や対応するHEXコードなど、各種プラットフォームの要素を参照してください。

注:新しいHEXカラーコードを追加するときは、冒頭に「#」を含む、完全なコードを入力してください(例:黒の場合は#000000)。 「#」が抜けていると、Hopinインターフェースで予期せぬ結果が表示される可能性があります。

プログレスタイマー

本機能の外観

Screen_Shot_2020-07-14_at_9.46.17_AM.png

対応するHEXコード

Screen_Shot_2020-07-14_at_9.46.28_AM.png

 

プログレスタイマー

本機能の外観

Screen_Shot_2020-07-14_at_9.47.11_AM.png

対応するHEXコード

Screen_Shot_2020-07-14_at_9.47.23_AM.png

 

見出し

本機能の外観

Screen_Shot_2020-07-14_at_9.47.36_AM.png

対応するHEXコード

Screen_Shot_2020-07-14_at_9.47.47_AM.png

 

ツールチップ

本機能の外観

Screen_Shot_2020-07-14_at_9.48.02_AM.png

対応するHEXコード

Screen_Shot_2020-07-14_at_9.48.13_AM.png

 

アイコン

本機能の外観

Screen_Shot_2020-07-14_at_9.48.27_AM.png

対応するHEXコード

Screen_Shot_2020-07-14_at_9.48.40_AM.png

 

入力

本機能の外観

Screen_Shot_2020-07-14_at_9.49.31_AM.png

対応するHEXコード

Screen_Shot_2020-07-14_at_9.49.41_AM.png

 

ボタン(セカンダリ)

本機能の外観

Screen_Shot_2020-07-14_at_9.48.59_AM.png

対応するHEXコード

Screen_Shot_2020-07-14_at_9.49.20_AM.png

 

検索

本機能の外観

Screen_Shot_2020-07-14_at_9.50.26_AM.png

対応するHEXコード

Screen_Shot_2020-07-14_at_9.50.34_AM.png

 

現在進行中のカード(レセプションページ)

本機能の外観

Screen_Shot_2020-07-28_at_9.55.12_AM.png

対応するHEXコード

aa1e0153d5c5e27e507d93a9569e0e6c.png

 

アイコン

本機能の外観

Screen_Shot_2020-07-14_at_9.50.44_AM.png

対応するHEXコード

Screen_Shot_2020-07-14_at_9.50.53_AM.png

 

カード

本機能の外観

Screen_Shot_2020-10-23_at_8.08.58_PM.png

対応するHEXコード

Screen_Shot_2020-07-14_at_9.52.06_AM.png

 

ボタン(プライマリ)

本機能の外観

Screen_Shot_2020-07-14_at_9.52.29_AM.png

対応するHEXコード

Screen_Shot_2020-07-14_at_9.52.42_AM.png

 

サイドバー

本機能の外観

Screen_Shot_2020-07-14_at_9.53.15_AM.png

対応するHEXコードScreen_Shot_2020-07-14_at_9.53.33_AM.png

 

ボタン(セカンダリ)

本機能の外観

Screen_Shot_2020-07-14_at_9.53.53_AM.png

対応するHEXコード

Screen_Shot_2020-07-14_at_9.54.04_AM.png

 

スケジュールテーブル

本機能の外観

Screen_Shot_2020-10-23_at_8.10.09_PM.png

対応するHEXコード

 Screen_Shot_2020-10-23_at_8.11.02_PM.png

 

メッセージ(チャット)

本機能の外観

Screen_Shot_2020-07-14_at_9.54.51_AM.png

対応するHEXコード

Screen_Shot_2020-07-14_at_9.55.05_AM.png

 

サイドパネル(またはタブパネル)

本機能の外観

Screen_Shot_2020-10-23_at_8.18.48_PM.png

対応するHEXコード

Screen_Shot_2020-07-14_at_9.56.18_AM.png

 

現在進行中のカード(レセプションページ)

本機能の外観

Screen_Shot_2020-07-14_at_9.56.44_AM.png

対応するHEXコード

Screen_Shot_2020-07-14_at_9.57.03_AM.png

 

テキストラベル(12pxのテキスト)

本機能の外観

Screen_Shot_2020-10-23_at_8.13.07_PM.png

対応するHEXコード

Screen_Shot_2020-07-14_at_9.56.56_AM.png

 

トグルボタン

本機能の外観

Screen_Shot_2020-07-14_at_9.57.21_AM.png

対応するHEXコード

Screen_Shot_2020-07-14_at_9.57.34_AM.png

 

テキストの見出し(中)(例:ヘッダーのイベントタイトル、レセプションのタイトル)

本機能の外観

Screen_Shot_2020-07-14_at_9.57.59_AM.png

対応するHEXコード

Screen_Shot_2020-07-14_at_9.58.10_AM.png

 

カード

本機能の外観

Screen_Shot_2020-07-14_at_9.58.26_AM.png

対応するHEXコード

Screen_Shot_2020-07-14_at_9.58.36_AM.png

 

ボタンと入力境界線の半径(エッジシャープネス)

注:ボタン境界線の半径を変更するには、プライマリ400のカラーにカスタムのHEXコードを入力する必要があります。

既定の入力境界線の半径(4px)

Screen_Shot_2020-07-28_at_6.19.57_PM.png

カスタマイズされた入力境界線の半径(64px)

Screen_Shot_2020-07-28_at_6.19.12_PM.png

対応するHEXコードScreen_Shot_2020-07-28_at_5.56.04_PM.png

既定のボタン境界線の半径(4px)

Screen_Shot_2020-07-28_at_5.58.19_PM.png

カスタマイズされたボタン境界線の半径(64px)

Screen_Shot_2020-07-28_at_6.19.28_PM.png

 

特定のテーマと高度なブランディングの詳細については、ダークテーマハイライトテーマ、またはシンプルテーマを作成するためのガイドをご覧ください。

ご質問やサポートのお問い合わせは、support@hopin.comまでお気軽にお寄せください。

この記事は役に立ちましたか?