The Dromo Uploader supports custom CSS styling. You can use the styleOverrides prop to customize the appearance of the uploader.
​
styleOverrides
object
default:"{}"
Specify custom CSS styling on any UI element to make it match your brand requirements.
For a visual overlay of the available styling options, see the guide to customizing styles.
​
global
object
Style overrides that affect the general UI of the Dromo Uploader
​
primaryTextColor
string
The primary text color
​
secondaryTextColor
string
The secondary text color
​
customFontURL
string
A URL to a custom font file
​
customFontFamily
string
The name of the font family provided by the custom font file
​
backgroundColor
string
default:"#ffffff"
Added in v2The background color of the modal
​
borderRadius
string
default:"8px"
Added in v2The border radius of the modal
​
borderStyle
string
default:"none"
Added in v2The border style of the modal
​
borderWidth
string
default:"none"
Added in v2The border width of the modal
​
borderColor
string
default:"none"
Added in v2The border color of the modal
​
primaryButton
object
default:"{}"
Style overrides for the primary action button
​
borderRadius
string
The radius of the button
​
backgroundColor
string
The background color of the button
​
textColor
string
The color of the text in the button
​
border
string
The border shorthand property to apply to the button
​
hoverBackgroundColor
string
The background color of the button while hovering
​
hoverTextColor
string
The text color of the button while hovering
​
hoverBorder
string
The border shorthand property to apply to the button while hovering
​
secondaryButton
object
default:"{}"
Style overrides for the secondary action button
​
borderRadius
string
The radius of the button
​
backgroundColor
string
The background color of the button
​
textColor
string
The color of the text in the button
​
border
string
The border shorthand property to apply to the button
​
hoverBackgroundColor
string
The background color of the button while hovering
​
hoverTextColor
string
The text color of the button while hovering
​
hoverBorder
string
The border shorthand property to apply to the button while hovering
​
dropzone
object
default:"{}"
Style overrides for the file dropzone on the upload screen
​
borderWidth
number
default:"2"
The width of the dropzone border in pixels
​
borderRadius
number
default:"8"
The radius of the dropzone border in pixels
​
borderColor
string
The color of the dropzone border
​
borderStyle
string
default:"dashed"
The style of the dropzone border
​
backgroundColor
string
The background color of the dropzone
​
outline
string
The outline property of the dropzone
​
helpText
object
default:"{}"
Style overrides for the help text boxes
​
textColor
string
The text color of the help text
​
backgroundColor
string
The background color of the help text box
​
stepperBar
object
default:"{}"
Style overrides for the progress bar in the header
​
completeColor
string
The color of completed steps
​
incompleteColor
string
The color of steps that have not been started yet
​
currentColor
string
The color of the step currently in progress
​
fontSize
string
default:"1rem"
Added in v2The font size of the step text
​
completeFontWeight
string
default:"bold"
Added in v2The font weight of completed steps
​
incompleteFontWeight
string
default:"normal"
Added in v2The font weight of incomplete steps
​
currentFontWeight
string
default:"bold"
Added in v2The font weight of the current step
​
backgroundColor
string
Added in v2The background color of the stepper bar
​
borderBottom
string
Added in v2The bottom border separating the stepper bar from the rest of the modal