アイコン、色、テーマ

公開ドキュメント全体で、アイコン、色、テーマなどのより細かな設定をカスタマイズします

タイトル、アイコンとロゴ

タイトル

サイトに任意のタイトルを設定できます。注: この設定は表示されるタイトルにのみ影響します 公開されたドキュメント内で。GitBook アプリでタイトルを編集したい場合は、カスタマイズメニューを閉じ、セクション上部で編集してください。

アイコン

絵文字を設定することも、自分で用意したアイコンをアップロードすることもできます。 カスタマイズ メニューで設定したアイコンは、ドキュメントサイトのファビコンとして使用されます。変更が公開済みドキュメントに反映されるまで数分かかることがあります。新しいファビコンが表示されない場合は、ブラウザに古いものがキャッシュされている可能性があるため、別のブラウザを試してください。

この設定は表示されるアイコンにのみ影響します 公開されたドキュメント内で。GitBook アプリ内で使用されるアイコンを編集したい場合は、セクション自体でコンテンツを編集する際に行えます。

カスタムロゴ

置き換えることができます 両方の 公開サイトのタイトルとアイコンをカスタムロゴに置き換えることで、ドキュメントにあなた自身のブランドをより反映できます。2 つのバージョンをアップロードできます。1 つはライトモード用、もう 1 つはダークモード用です。

アイコンとロゴのオプションの違いは何ですか？

アイコン設定では、132×132px の小さな画像をアップロードでき、 併せて サイトのタイトルとして表示され、サイトのファビコンとして機能します。カスタムロゴのオプションでは、より大きな画像（幅 600px 以上を推奨）をアップロードでき、設定済みのアイコンとタイトルを完全に置き換えます。

テーマ

テーマを使うと、公開コンテンツの配色をライトモードとダークモードの両方でカスタマイズできます。4 つのテーマから選べます。サイトの色は、 プライマリカラー と 色味 によって直接影響を受けます。これら 2 つの選択はインターフェースのさまざまな部分に影響し、サイトの見た目や雰囲気を一変させることもできます。

クリーン

半透明と最小限の装飾要素を特徴とするモダンなテーマです。プライマリカラー（または色味）は、リンクやその他の強調されたインターフェース要素に影響します。

クリーンはすべてのサイトで利用でき、デフォルトテーマです。

ミュート

要素間のコントラストを抑えた洗練されたテーマです。サイトの背景がより際立ち、前景と自然に溶け合い、一部の要素は反転した見た目になります。これらはすべて、プライマリカラー（または色味）に基づいています。

ミュートはすべてのサイトで利用できます。

ボールド

鮮やかな色と強いコントラストが印象的なテーマです。プライマリカラー（または色味）はサイトのヘッダーに使用され、アイコンなどの他の強調要素もそれに合わせて色付けされます。

ボールドは Essential または Ultimate のサイトでのみ利用できます。

グラデーション

グラデーション背景と色彩のアクセントを特徴とする、トレンド感のあるテーマです。グラデーションと強調要素は、プライマリカラー（または色味）で色付けされます。

グラデーションは Essential または Ultimate のサイトでのみ利用できます。

色

プライマリカラー

サイトのプライマリカラーは、強調表示されたインターフェース項目や、リンク、現在のページとセクション、パンくずリスト、ヘッダーの主要ボタンなどのナビゲーション要素のスタイルに影響します。

GitBook は、背景とのコントラストが低すぎる場合や、訪問者のシステムがより高いコントラストを要求している場合に、可読性のため個々の要素の色を自動調整します。

色味のカラー

サイトの色味のカラーは、ヘッダーのリンク、アイコンの色、次のような UI 要素を含め、サイト全体のすべてのテキストとアイコンの色をさりげなく変化させます。 質問するか検索 バー。

色味のカラーは ではなく 常にプライマリカラーを使用するリンクやボタンなどのナビゲーション要素に影響します。

の 色味のカラー セクションでは、プライマリカラーの選択に基づいた推奨カラーが表示されます。1 つ選んでプレビューするか、プライマリカラーを色味として選ぶか、カラーピッカーで完全にカスタムの色を選択できます。

色味を使って背景色を設定する

非常に明るい（白に近い）か非常に暗い（黒に近い）色味を選び、その色がニュートラルな色合いに近い場合、GitBook はデフォルトの白またはダーク背景の代わりに、その色をサイトの正確な背景色として使用します。これにより、適切な色味を選ぶだけで、ライトモードではわずかにオフホワイトや温かみのある紙のような雰囲気を、ダークモードでは特定の深い暗色の背景をドキュメントに与えられます。

覚えておくべき点がいくつかあります。

• 色味はニュートラルに近い必要があります（わずかに色がついている程度）。強い色味では GitBook の標準背景が維持され、アクセント部分だけに色味がつきます。
• 明るさがはっきりしているか、暗さがはっきりしている必要があります。中間的なグレーでは背景は変わりません。
• この ボールド テーマでは、色味はページ背景ではなくヘッダーに適用されるため、背景はそのままです。

セマンティックカラー

セマンティックカラーは公開コンテンツ内のヒントブロックに適用され、コードブロックにも適用できます。

各ヒントスタイルの背景色を変更できます。これらの変更は、カスタマイズ中の公開サイトに反映されます。

注： GitBook エディタ内のヒントブロックは常に標準色のままで、サイトのセマンティックカラーとは一致しません。

コードテーマ

コードテーマは、公開ドキュメント内のコードブロックと API ブロックの見た目を変更します。

テーマ一覧には次が含まれます:

• アダプティブテーマ – これらの標準ライト／ダークモードテーマは、サイトのカラーパレットを使ってブランドに合わせます。
• Shiki テーマ – ライトモードとダークモードの両方で、60 種類以上のテーマプリセットから選べます。

ドキュメントのライトモードとダークモードで個別のコードテーマを選択できます。また、ドキュメントがライトモードのときにダークコードテーマを使うなど、任意のライト／ダーク配色をどのモードでも使用できます。

デフォルトでは、選択したテーマはコードブロックと OpenAPI ブロックの両方に適用されます。OpenAPI ブロックに別のテーマを設定したい場合は、 ブロック種別ごとにカスタマイズ ボタン。

モード

モード切り替えを表示

訪問者がライトモードとダークモードを手動で切り替えられるようにしたい場合は、これを有効にしてください。読者はデスクトップでもモバイルでも、公開ページの下部で切り替えを見つけられます。

デフォルトモード

訪問者がコンテンツをデフォルトでライトモードまたはダークモードのどちらで見るかを選択します。 モード切り替えを表示 が有効ならモードを切り替えられます。無効なら、ここで選んだモードのみが表示されます。

注: GitBook アプリ内でテーマを変更するには、サイドバー下部の設定メニューに移動してください。

サイトスタイル

フォントファミリー

公開コンテンツ用の標準フォントと等幅フォントを、厳選された人気オプションの一覧から選べます。

メインフォント

これは、デフォルトでサイト全体に使用されるフォントです。サイトでは本文と UI テキストに常に使用されます。

見出し

見出しフォントは任意で、サイトの Page、H1、H2、H3 見出しにのみ適用されます。デフォルトでは、見出しフォントはサイトのメインフォントに合わせて設定されています。

等幅

等幅フォントは、ドキュメントサイトのコードブロックと OpenAPI ブロックで使用されます。

カスタムフォント

独自の標準フォントと等幅フォントをアップロードして、公開コンテンツをブランドのスタイルガイドに合わせられます。フォントをアップロードするには、 カスタムフォントを追加 をクリックし、指示に従ってください。通常ウェイトと太字ウェイトの両方のフォントファイルをアップロードする必要があります。

GitBook は現在、 .woff と .woff2 をサポートしています。その他の形式については、 [e-mail].

アイコン

ページアイコンを使用する場合は、ここで表示されるアイコンの太さとスタイルを設定します。

この設定は、公開サイト上のページアイコンの太さとスタイルを制御します。ページグループのアイコンやインラインアイコンは定義しません。ページグループのアイコンはセクションの目次で設定してください。インラインアイコンは インラインコンテンツ.

角のスタイル

ブランドのスタイルに合わせて、角を丸くするか直角にするかを選べます。

深さのスタイル

カード、ボタン、その他の影のある要素に適用される 2 つの深さスタイルから選べます:

• 控えめ: わずかな影と立体感。
• フラット: 影や立体感なし。

リンクスタイル

2 種類のリンクデザインから選べます:

• デフォルト: リンク全体をプライマリカラーまたは色味で強調します。
• アクセント: リンクに色付きの下線を追加し、文字色は変更しません。

サイドバースタイル

このメニューでは、さまざまなスタイルがサイドバーの見た目をどのように変えるかを視覚的に確認できます。

背景スタイル

サイドバーコンテナの背景スタイルを選びます。色は選択したテーマから導出されます。

2 つのオプションがあります。 デフォルト と 塗りつぶし。それぞれ、目次がどのように変わるかのプレビューが表示されます。

リストスタイル

サイドバーのリストと選択項目のスタイルを選びます。3 つのオプションがあります。 デフォルト, ピル、そして ライン。それぞれ、目次がどのように変わるかのプレビューが表示されます。