Custom Theme
Override CSS custom properties to match your brand colors.
Live Preview
This widget uses a green color scheme defined via CSS custom properties:
CSS Code
Add these CSS custom properties to override the default colors:
/* Target the capwave-uploader element */
capwave-uploader {
--capwave-border: #22c55e;
--capwave-highlight: #16a34a;
--capwave-button-bg: #166534;
--capwave-shadow: rgba(22, 101, 52, 0.3);
}
Available CSS Properties
| Property | Default | Description |
|---|---|---|
--capwave-bg |
#FFFFFF |
Widget background color |
--capwave-text |
#1A1C52 |
Primary text color |
--capwave-border |
#5D54DE |
Dropzone border and progress bar color |
--capwave-highlight |
#2A338A |
Title highlight and hover states |
--capwave-button-bg |
#1A1C52 |
Upload button background |
--capwave-button-text |
#FFFFFF |
Upload button text color |
--capwave-shadow |
rgba(12, 12, 13, 0.4) |
Shadow color for card and button |
See the Theming guide for the complete list of properties.