次の方法で共有

Office.OfficeTheme interface

パッケージ:
office

Office テーマの色のプロパティにアクセスできるようにします。

Office テーマの色を使用すると、アドインの配色を、ユーザーが選択した現在の Office テーマと調整できます。 ユーザーは、Office アプリケーションで File>Account または Office アカウント>Office テーマを使用してテーマを設定します。 選択したテーマが、すべての Office アプリケーションに適用されます。 Using Office theme colors is appropriate for mail and task pane add-ins.

Office のテーマの詳細については、「Microsoft 365 の外観を変更する」を参照してください。

注釈

サポートされているアプリケーション (プラットフォーム別)

Office on the web Office on Windows Office on Mac iOS 上の Office Android 上の Office
Excel サポート サポート サポート サポート 利用不可
Outlook サポート サポート 使用不可 使用不可 使用不可
PowerPoint サポート サポート サポート サポート 利用不可
Word サポート サポート サポート サポート 利用不可

重要: Outlook では、 メールボックス要件セット 1.14 以降、Office テーマ API がサポートされています。 イベント ベースのアクティブ化を実装する Outlook アドインではサポートされていません。

例

function applyOfficeTheme() {
    // Identify the current Office theme in use.
    const currentOfficeTheme = Office.context.officeTheme.themeId;

    if (currentOfficeTheme === Office.ThemeId.Colorful || currentOfficeTheme === Office.ThemeId.White) {
        console.log("No changes required.");
    }

    // Get the colors of the current Office theme.
    const bodyBackgroundColor = Office.context.officeTheme.bodyBackgroundColor;
    const bodyForegroundColor = Office.context.officeTheme.bodyForegroundColor;
    const controlBackgroundColor = Office.context.officeTheme.controlBackgroundColor;
    const controlForegroundColor = Office.context.officeTheme.controlForegroundColor;

    // Apply theme colors to a CSS class.
    $("body").css("background-color", bodyBackgroundColor);

    if (Office.context.officeTheme.isDarkTheme()) {
        $("h1").css("color", controlForegroundColor);
    }
}

プロパティ

bodyBackgroundColor

Office テーマ本体の背景色を 16 進色のトリプレット ("#FFA500" など) として取得します。
bodyForegroundColor

Office テーマ本体の前景色を 16 進色のトリプレット ("#FFA500" など) として取得します。
controlBackgroundColor

Office テーマ コントロールの背景色を 16 進色のトリプレット ("#FFA500" など) として取得します。
controlForegroundColor

Office テーマ コントロールの前景色を 16 進色のトリプレット ("#FFA500" など) として取得します。
isDarkTheme

現在選択されている Office テーマが黒 (ダーク モード) または濃い灰色の場合は、trueを返します。
themeId

現在選択されている Office テーマを取得します。

プロパティの詳細

bodyBackgroundColor

Office テーマ本体の背景色を 16 進色のトリプレット ("#FFA500" など) として取得します。

bodyBackgroundColor: string;

プロパティ値

string

bodyForegroundColor

Office テーマ本体の前景色を 16 進色のトリプレット ("#FFA500" など) として取得します。

bodyForegroundColor: string;

プロパティ値

string

controlBackgroundColor

Office テーマ コントロールの背景色を 16 進色のトリプレット ("#FFA500" など) として取得します。

controlBackgroundColor: string;

プロパティ値

string

controlForegroundColor

Office テーマ コントロールの前景色を 16 進色のトリプレット ("#FFA500" など) として取得します。

controlForegroundColor: string;

プロパティ値

string

isDarkTheme

現在選択されている Office テーマが黒 (ダーク モード) または濃い灰色の場合は、trueを返します。

isDarkTheme: boolean;

プロパティ値

boolean

注釈

重要: isDarkTheme プロパティは Outlook ではサポートされていません。 Outlook で現在のテーマを決定するには、代わりに body*Color プロパティと control*Color プロパティを使用します。 テーマの変更を自動的に検出するには、 addHandlerAsync メソッドを使用して 、OfficeThemeChanged イベントのイベント ハンドラーを作成します。

themeId

現在選択されている Office テーマを取得します。

themeId: ThemeId;

プロパティ値

Office.ThemeId

注釈

重要: themeId プロパティは Outlook ではサポートされていません。 Outlook で現在のテーマを決定するには、代わりに body*Color プロパティと control*Color プロパティを使用します。 テーマの変更を自動的に検出するには、 addHandlerAsync メソッドを使用して 、OfficeThemeChanged イベントのイベント ハンドラーを作成します。