Exploring Themes and Styles in App Studio

This video introduces how to customize the look and feel of your data apps using themes and styling tools built into Plotly App Studio. With no need to write CSS or touch layout code, developers can quickly create polished, user-friendly data apps that reflect their brand or visual preferences.

In the App Editor, users can open the App Styling panel to explore different visual themes. There are ten presets available, including five light and five dark themes. These provide a quick way to apply consistent color schemes and layouts across the app.

For more control, the Custom option enables fine-tuning of visual elements:

• Select brand colors using hex codes or the built-in palette
• Adjust corner rounding for a softer or more minimal look
• Choose between compact or spacious layout spacing
• Set global font styles to match internal design guides

All changes are reflected live in the editor and do not require manual code updates. The styling engine automatically generates the necessary configuration and applies it to your app layout. With a single click, the finished app can be deployed.

In addition to app-level theming, users can customize the look of their development workspace. Within the App Studio settings, under the Workbench Appearance menu, developers can change the editor's theme and color scheme to suit their preferences.

This streamlined approach to styling helps teams move quickly from prototype to production while maintaining consistency and visual clarity. Watch the video to see the theming workflow in action and explore more App Studio tutorials for additional tips.