@mui/base

Unstyled components

Provides unstyled versions of Material-UI components that can be used as a starting point for custom styling.

import { SliderUnstyled } from '@mui/base';

function MySlider() {
  return <SliderUnstyled defaultValue={30} />;
}

Hooks

Offers a set of hooks for managing component state and behavior, such as button states and focus management.

import { useButton } from '@mui/base/ButtonUnstyled';

function MyButton(props) {
  const { active, focusVisible, setFocusVisible, getRootProps } = useButton(props);
  return <button {...getRootProps()}>My Unstyled Button</button>;
}

Utilities

Includes utilities for handling owner state, component slots, and other low-level concerns in component development.

import { appendOwnerState } from '@mui/base';

function MyComponent(props) {
  const ownerState = { variant: 'contained' };
  const newProps = appendOwnerState(MyComponent, props, ownerState);
  return <div {...newProps} />;
}