Translucent

Theme global translucent level to change traslucent variant's transparency.

Basic Usage

By default, the root ThemeProvider translucent is 20%. To set a different translucent pass it via the translucent prop. This will force the theme to use the specified setting.

<ThemeProvider translucent="20%">
<App />
</ThemeProvider>

Preview

Card Title

Subtitle here
This is the content of the card.

Card Title

Subtitle here
This is the content of the card.

Switching Scaling

You can switch translucent by following code.

const { translucent, onTranslucentChange } = useThemeContext();
const handleScaleChange = () => {
onTranslucentChange('80%');
};
Scaling
Previous
Shadow
Next