More Premium Hugo Themes Premium React Themes

Material UI Image

Material style image with loading animation

Material UI Image

Material style image with loading animation

Author Avatar Theme by teamwertarbyte
Github Stars Github Stars: 213
Last Commit Last Commit: Apr 24, 2021 -
First Commit Created: Jan 15, 2024 -
default image

Overview:

The Material UI Image is a component that enhances the loading experience of images by fading them in, following the material design image loading pattern. It is designed to be used with Material-UI 1.0.0-rc.0 or later.

Features:

  • Fading Animation: The image fades in with a specified duration of the animation.
  • Aspect Ratio: Allows you to specify the aspect ratio of the image.
  • Cover: Overrides the image’s object fit to cover the container.
  • Background Color: You can override the background color of the image.
  • Disable Error: Disables the error icon if set to true.
  • Disable Spinner: Disables the loading spinner if set to true.
  • Disable Transition: Disables the transition if set to true.
  • Customization: You can override various inline-styles like image style, icon container style, and root element style.

Installation:

To install the Material UI Image component, you need to have Material-UI 1.0.0-rc.0 or later installed. If you are using a previous version, it is recommended to update to the latest version.

npm install @material-ui/image

Summary:

The Material UI Image component enhances the loading experience of images by fading them in, following the material design image loading pattern. It provides various customization options and can be easily integrated with Material-UI.