creating-streamlit-themes

Create cohesive Streamlit themes by editing config.toml [theme] sections.

Updated Aug 23, 2026
One-click install
npx skills add https://github.com/n-elia/barbarapp --skill creating-streamlit-themes
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: creating-streamlit-themes
Source: https://github.com/n-elia/barbarapp/tree/main/.skills/developing-with-streamlit/skills/creating-streamlit-themes
Command: npx skills add https://github.com/n-elia/barbarapp --skill creating-streamlit-themes

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps teams quickly implement cohesive Streamlit themes that match brand guidelines, ensuring consistent visuals across dashboards and apps.

Core Features & Use Cases

  • Config.toml Theme: Define a centralized [theme] block and optional [theme.sidebar] to control colors, typography, borders, and radii for all Streamlit apps.
  • Branding & Accessibility: Create brand-aligned color palettes, typography, and contrast for accessible UI across light/dark modes.
  • Use Case: A team wants to deploy a branded analytics app and multiple internal tools with a single theme that updates across all pages.

Quick Start

Create a basic theme by editing the Streamlit config.toml: add a [theme] section with base, colors, font settings, and, optionally, [theme.sidebar].

Frequently Asked Questions about creating-streamlit-themes

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I create a custom Streamlit theme for brand-aligned dashboards?▼

To create a custom Streamlit theme, edit the config.toml file by adding a [theme] section with your brand's base theme, color palette, font settings, and optionally a [theme.sidebar] block to standardize app appearance across multiple dashboards.

Can I configure separate dark mode and light mode color palettes in Streamlit?▼

Yes, you can configure light and dark mode color palettes in Streamlit by defining the primary, background, and secondary background colors along with text colors within the config.toml [theme] section to ensure accessible contrast across both modes.

How do I set custom typography and fonts for a Streamlit app?▼

You set custom typography for a Streamlit app by specifying the font, font family, and heading font family parameters inside the [theme] block of your config.toml file, overriding the default Streamlit fonts to match your branding.

What is the best way to standardize visual styling across multiple Streamlit apps?▼

The best way to standardize visual styling across multiple Streamlit apps is by centralizing your color palettes, typography, borders, and radii settings into a single config.toml [theme] definition that can be deployed consistently across all dashboards.

Does configuring a Streamlit theme require modifying the config.toml file?▼

Yes, configuring a Streamlit theme requires editing the config.toml file, where you define the [theme] section to apply base themes, colors, typography, and borders, ensuring a cohesive and brand-aligned user interface.

Why are my custom Streamlit theme colors not applying to the sidebar?▼

Your custom Streamlit theme colors may not apply to the sidebar because the optional [theme.sidebar] block is not defined in your config.toml, which is required to control specific sidebar background and border styling separately from the main app.