Scaling

Change your application's scaling that fits your needs.

Basic Usage

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

<ThemeProvider scaling="90%">
<App />
</ThemeProvider>

Preview

Card Title

Subtitle here
This is the content of the card.
110%

Card Title

Subtitle here
This is the content of the card.
90%

Switching Scaling

You can switch scaling by following code.

const { scaling, onScalingChange } = useThemeContext();
const handleScaleChange = () => {
onScalingChange('100%');
};
Radius
Previous
Translucent
Next