Style Components#

Panel provides a comprehensive system for applying designs, themes and custom styling for components. This section will take you through these concepts.

Apply a Design

How to switch between different design systems.

Toggle themes

How to toggle between themes (e.g. ‘light’ and ‘dark’).

Apply CSS

How to apply custom CSS styling.

Customize a Design

How to customize designs and themes with CSS variables.

Customize Loading Icon

How to customize the loading icon.

Control Visibility

How to control the visibility of a component.

This section will show you how to style the most common plotting libraries for use with Panel.


How to style an Altair plot


How to style an ECharts plot


How to style a Matplotlib plot


How to style a Plotly plot

Vega Lite

How to style a Vega Lite plot