Menu
Home
Why Umbra
Sign In
Pages
Home
Why Umbra
Umbra
Sign In
ADVANCED
Inputs
Standard input styles
Toggle Dark Mode
Site Route
(Invalid)
{ "value": "[empty]" }
md
Click to add a link
lg
Click to add a link
xl
Click to add a link
Icon Library
(Invalid)
{ "value": "[empty]" }
md
Select Icon
lg
Select Icon
xl
Select Icon
Media Library
(Invalid)
{ "value": "[empty]" }
md
Add Background
lg
Add Background
xl
Add Background
Media Upload
(Invalid)
{ "value": "[empty]" }
md
Upload
lg
Upload
xl
Upload
Tags
(Invalid)
{ "value": "[empty]" }
md
lg
xl
Gradient
(Invalid)
{ "value": "[empty]" }
md
Gradient Preview
No Color Stops Added
Add Color
90°
lg
Gradient Preview
No Color Stops Added
Add Color
90°
xl
Gradient Preview
No Color Stops Added
Add Color
90°
Text
(Invalid)
{ "value": "[empty]" }
md
lg
xl
Textarea
(Invalid)
{ "value": "[empty]" }
md
lg
xl
Price
(Invalid)
{ "value": "[empty]" }
md
$
lg
$
xl
$
URL
(Invalid)
{ "value": "[empty]" }
md
lg
xl
Email
(Invalid)
{ "value": "[empty]" }
md
lg
xl
Number
(Invalid)
{ "value": "[empty]" }
md
lg
xl
One Time Code
(Invalid)
{ "value": "[empty]" }
md
lg
xl
Password
(Invalid)
{ "value": "[empty]" }
md
lg
xl
Phone
(Invalid)
{ "value": "[empty]" }
md
lg
xl
Font
(Invalid)
{ "value": "[empty]" }
md
Default
lg
Default
xl
Default
Handle
(Invalid)
{ "value": "[empty]" }
md
https://
.test.com
lg
https://
.test.com
xl
https://
.test.com
Select
(Invalid)
{ "value": "[empty]" }
md
Select
lg
Select
xl
Select
Range
(Invalid)
{ "value": "[empty]" }
md
lg
xl
Color Scheme
(Invalid)
{ "value": "[empty]" }
md
Select
lg
Select
xl
Select
Color Picker
(Invalid)
{ "value": "[empty]" }
md
Select
lg
Select
xl
Select
Date
(Invalid)
{ "value": "[empty]" }
md
lg
xl
Yes / No
(Invalid)
{ "value": "[empty]" }
md
-
No options
lg
-
No options
xl
-
No options
Multiple Choice (Single)
(Invalid)
{ "value": "[empty]" }
md
-
No options
lg
-
No options
xl
-
No options
Multiple Choice (Multiple)
(Invalid)
{ "value": "[empty]" }
md
-
No options
lg
-
No options
xl
-
No options
Opinion Scale
(Invalid)
{ "value": "[empty]" }
md
0
1
2
3
4
5
lg
0
1
2
3
4
5
xl
0
1
2
3
4
5
NPS
(Invalid)
{ "value": "[empty]" }
md
0
1
2
3
4
5
lg
0
1
2
3
4
5
xl
0
1
2
3
4
5
Rating
(Invalid)
{ "value": "[empty]" }
md
0
1
2
3
4
5
lg
0
1
2
3
4
5
xl
0
1
2
3
4
5
Ranking
(Invalid)
{ "value": "[empty]" }
md
No Options
lg
No Options
xl
No Options
Radio
(Invalid)
{ "value": "[empty]" }
md
lg
xl
Radio Button
(Invalid)
{ "value": "[empty]" }
md
lg
xl
Select Custom
(Invalid)
{ "value": "[empty]" }
md
Select
lg
Select
xl
Select
Toggle
(Invalid)
{ "value": "[empty]" }
md
off
lg
off
xl
off
TimeZone
(Invalid)
{ "value": "[empty]" }
md
UTC (UTC)
lg
UTC (UTC)
xl
UTC (UTC)
Weight
(Invalid)
{ "value": "[empty]" }
md
1
2
3
4
5
6
7
8
9
10
lg
1
2
3
4
5
6
7
8
9
10
xl
1
2
3
4
5
6
7
8
9
10
Checkbox
(Invalid)
{ "value": "[empty]" }
md
lg
xl
Checkbox Multi
(Invalid)
{ "value": "[empty]" }
md
No Items
lg
No Items
xl
No Items
Markdown
(Invalid)
{ "value": "[empty]" }
md
lg
xl
Array List (Media)
(Invalid)
{ "value": "[empty]" }
md
Add Item
lg
Add Item
xl
Add Item
Overlay
(Invalid)
{ "value": "[empty]" }
md
Overlay Color
Gradient Preview
No Color Stops Added
Add Color
90°
Overlay Opacity
Overlay Blend Mode
Select
normal
overlay
multiply
screen
darken
lighten
color-dodge
color-burn
hard-light
soft-light
difference
exclusion
hue
saturation
color
luminosity
lg
Overlay Color
Gradient Preview
No Color Stops Added
Add Color
90°
Overlay Opacity
Overlay Blend Mode
Select
normal
overlay
multiply
screen
darken
lighten
color-dodge
color-burn
hard-light
soft-light
difference
exclusion
hue
saturation
color
luminosity
xl
Overlay Color
Gradient Preview
No Color Stops Added
Add Color
90°
Overlay Opacity
Overlay Blend Mode
Select
normal
overlay
multiply
screen
darken
lighten
color-dodge
color-burn
hard-light
soft-light
difference
exclusion
hue
saturation
color
luminosity
DropDown
(Invalid)
{ "value": "[empty]" }
md
Select
lg
Select
xl
Select