Syncfusion React Material Theme

A comprehensive Material theme package for Syncfusion® React UI components. This package provides a complete set of styles based on modern design principles, offering a consistent and polished look across all Syncfusion® components in your React applications.

Features

• 🎨 Complete Theme Coverage - Includes styles for all Syncfusion React components
• 🚀 Production Ready - Optimized and minified CSS for best performance
• 🎯 Easy Integration - Simple setup with just one import
• ♿ Accessible - Built with WCAG 2.1 accessibility standards in mind
• 📱 Responsive - Adapts seamlessly to all screen sizes
• 🔧 Customizable - Built with SCSS variables for easy customization
• 🌓 Theme Support - Light and dark mode support out of the box

Installation

To install Material theme, use the following command:

npm install @syncfusion/react-material-theme

Usage

Import the theme CSS file in your application's entry point (e.g., index.js or App.js):

import '@syncfusion/react-material-theme/styles/material.css';

That's it! All Syncfusion® React components will now use the Material theme.

Using with Individual Components

If you want to use styles for specific components only:

// Import base styles
import '@syncfusion/react-material-theme/styles/base/material.css';

// Import specific component styles
import '@syncfusion/react-material-theme/styles/buttons/material.css';
import '@syncfusion/react-material-theme/styles/inputs/material.css';

Resources

For more information about Syncfusion® React components, visit:

• Syncfusion React Documentation

Support

Product support is available through the following mediums:

• Support ticket - Guaranteed Response in 24 hours | Unlimited tickets | Holiday support
• Live chat

License and copyright

This is a commercial product and requires a paid license for possession or use. Syncfusion’s licensed software, including this component, is subject to the terms and conditions of Syncfusion's EULA. To acquire a license for React UI components, you can purchase or start a free 30-day trial.

A free community license is also available for companies and individuals whose organizations have less than $1 million USD in annual gross revenue and five or fewer developers.

© Copyright 2026 Syncfusion®, Inc. All Rights Reserved. The Syncfusion® Essential Studio® license and copyright applies to this distribution.