Custom Components GalleryNEW
Explore
New to Gradio? Start here: Getting Started
See the Release History
Themes
%20Copyright%202022%20Fonticons,%20Inc.%20--%3e%3cpath%20d='M172.5%20131.1C228.1%2075.51%20320.5%2075.51%20376.1%20131.1C426.1%20181.1%20433.5%20260.8%20392.4%20318.3L391.3%20319.9C381%20334.2%20361%20337.6%20346.7%20327.3C332.3%20317%20328.9%20297%20339.2%20282.7L340.3%20281.1C363.2%20249%20359.6%20205.1%20331.7%20177.2C300.3%20145.8%20249.2%20145.8%20217.7%20177.2L105.5%20289.5C73.99%20320.1%2073.99%20372%20105.5%20403.5C133.3%20431.4%20177.3%20435%20209.3%20412.1L210.9%20410.1C225.3%20400.7%20245.3%20404%20255.5%20418.4C265.8%20432.8%20262.5%20452.8%20248.1%20463.1L246.5%20464.2C188.1%20505.3%20110.2%20498.7%2060.21%20448.8C3.741%20392.3%203.741%20300.7%2060.21%20244.3L172.5%20131.1zM467.5%20380C411%20436.5%20319.5%20436.5%20263%20380C213%20330%20206.5%20251.2%20247.6%20193.7L248.7%20192.1C258.1%20177.8%20278.1%20174.4%20293.3%20184.7C307.7%20194.1%20311.1%20214.1%20300.8%20229.3L299.7%20230.9C276.8%20262.1%20280.4%20306.9%20308.3%20334.8C339.7%20366.2%20390.8%20366.2%20422.3%20334.8L534.5%20222.5C566%20191%20566%20139.1%20534.5%20108.5C506.7%2080.63%20462.7%2076.99%20430.7%2099.9L429.1%20101C414.7%20111.3%20394.7%20107.1%20384.5%2093.58C374.2%2079.2%20377.5%2059.21%20391.9%2048.94L393.5%2047.82C451%206.731%20529.8%2013.25%20579.8%2063.24C636.3%20119.7%20636.3%20211.3%20579.8%20267.7L467.5%20380z'/%3e%3c/svg%3e)
Description
Customize the look of your app by writing your own custom theme
Base
gradio.Base(···)Initialization
| Parameter | Description |
|---|---|
primary_hue colors.Color | str default: Color() | The primary hue of the theme. Load a preset, like gradio.themes.colors.green (or just the string "green"), or pass your own gradio.themes.utils.Color object. |
secondary_hue colors.Color | str default: Color() | The secondary hue of the theme. Load a preset, like gradio.themes.colors.green (or just the string "green"), or pass your own gradio.themes.utils.Color object. |
neutral_hue colors.Color | str default: Color() | The neutral hue of the theme, used . Load a preset, like gradio.themes.colors.green (or just the string "green"), or pass your own gradio.themes.utils.Color object. |
text_size sizes.Size | str default: Size() | The size of the text. Load a preset, like gradio.themes.sizes.text_sm (or just the string "sm"), or pass your own gradio.themes.utils.Size object. |
spacing_size sizes.Size | str default: Size() | The size of the spacing. Load a preset, like gradio.themes.sizes.spacing_sm (or just the string "sm"), or pass your own gradio.themes.utils.Size object. |
radius_size sizes.Size | str default: Size() | The radius size of corners. Load a preset, like gradio.themes.sizes.radius_sm (or just the string "sm"), or pass your own gradio.themes.utils.Size object. |
font fonts.Font | str | Iterable[fonts.Font | str] default: (<gradio.themes.utils.fonts.GoogleFont (name='Source Sans Pro', weights=(400, 600))>, 'ui-sans-serif', 'system-ui', 'sans-serif') | The primary font to use for the theme. Pass a string for a system font, or a gradio.themes.font.GoogleFont object to load a font from Google Fonts. Pass a list of fonts for fallbacks. |
font_mono fonts.Font | str | Iterable[fonts.Font | str] default: (<gradio.themes.utils.fonts.GoogleFont (name='IBM Plex Mono', weights=(400, 600))>, 'ui-monospace', 'Consolas', 'monospace') | The monospace font to use for the theme, applies to code. Pass a string for a system font, or a gradio.themes.font.GoogleFont object to load a font from Google Fonts. Pass a list of fonts for fallbacks. |
Methods
Methods
push_to_hub
gradio.Base.push_to_hub(repo_name, ···)Description
Upload a theme to the HuggingFace hub. <br> This requires a HuggingFace account. <br>
Agruments
| Parameter | Description |
|---|---|
repo_name str required | The name of the repository to store the theme assets, e.g. 'my_theme' or 'sunset'. |
org_name str | None default: None | The name of the org to save the space in. If None (the default), the username corresponding to the logged in user, or hƒ_token is used. |
version str | None default: None | A semantic version tag for theme. Bumping the version tag lets you publish updates to a theme without changing the look of applications that already loaded your theme. |
hf_token str | None default: None | API token for your HuggingFace account |
theme_name str | None default: None | Name for the name. If None, defaults to repo_name |
description str | None default: None | A long form description to your theme. |
private bool default: False |
from_hub
gradio.Base.from_hub(repo_name, ···)Description
Load a theme from the hub. <br> This DOES NOT require a HuggingFace account for downloading publicly available themes. <br>
Agruments
| Parameter | Description |
|---|---|
repo_name str required | string of the form <author>/<theme-name>@<semantic-version-expression>. If a semantic version expression is omitted, the latest version will be fetched. |
hf_token str | None default: None | HuggingFace Token. Only needed to download private themes. |
load
gradio.Base.load(path, ···)Description
Load a theme from a json file. <br>
Agruments
| Parameter | Description |
|---|---|
path str required | The filepath to read. |
dump
gradio.Base.dump(filename, ···)Description
Write the theme to a json file. <br>
Agruments
| Parameter | Description |
|---|---|
filename str required | The path to write the theme too |
from_dict
gradio.Base.from_dict(theme, ···)Description
Create a theme instance from a dictionary representation. <br>
Agruments
| Parameter | Description |
|---|---|
theme dict[str, dict[str, str]] required | The dictionary representation of the theme. |
to_dict
gradio.Base.to_dict(···)Description
Convert the theme into a python dictionary.