I am developing a rich web application for performance analysis of Android graphics on mobile devices. This involves a good deal of tooling for running apps with instrumentation to gather performance and other diagnostic data, including but not limited to Perfetto traces.

For my users, the Perfetto UI is a preferred tool for visualizing the data in my application's traces. To that end, I want to embed the main trace viewer UI and some other bits such as the info page into my application. But, apart from any other integration issues to be addressed separately, there are problems with CSS styles from Perfetto modifying the look of elements in my application's UI and styles from my application breaking the Perfetto UI. Moreover, my application supports theming including stock light/dark themes and user themes.

It would help the embedding of Perfetto UI in this and perhaps other applications if we could:

• broaden the application of the pf- class name prefix that seems recently to be the norm to longer extant style classes
• extract font, color, shadow, and other similar definitions into real (not Sass) CSS variables that can be overridden by an embedding application for consistency with its them
• pull more fonts and colors from the effective CSS styles in the DOM in canvas rendering code, to match the theming supported by the previous item