Debug styles

If you don’t know where a style comes from, UI Toolkit offers several tools to investigate styles.

Matching Selectors

You can find the styles for an element in the Matching Selectors section in the UI Builder’s Inspector.

1. UI Builder の Canvas で、エレメントを選択します。
2. Inspector ウィンドウで、StyleSheet > Matching Selectors を展開します。

Matching Selectors セクションに以下が表示されます。

• 独自のスタイルシートからの USS セレクター
• デフォルトの Unity テーマからの USS セレクター

ノート: リストの下位に表示される USS セレクターは、常に上位の USS セレクターの同じスタイルプロパティをオーバーライドします。

UI Toolkit debugger

If the Matching Selectors section doesn’t provide enough information, you can use the UI Toolkit Debugger.

1. In the Viewport window of the UI Builder, click Preview to enable the Preview mode.
2. Select Window > UI Toolkit > Debugger.
3. UI Toolkit Debugger ウィンドウで、Pick Element を選択します。
4. In the Canvas of the UI Builder, select the element that you want to debug.

The UI Toolkit Debugger window displays the following:

• All child elements of the visual element
• All USS selectors for each component of the visual element
• 各 USS セレクターの詳細情報

その他の参考資料

• Test inside the UI Builder
• USS を使った UI のスタイル設定
• USS セレクター