🌈 react-image-shadow

A React image component. Simple realization of image shadow.

📚 Example

Online: https://image-component.github.io/react-image-shadow/

🌀 Template

https://github.com/one-template/react-component-template

📦 Install

npm i react-image-shadow
# or
yarn add react-image-shadow

🎉 Usage

import ImageShadow from 'react-image-shadow';
import 'react-image-shadow/assets/index.css';

const src =
  'https://github.com/image-component/gallery/blob/main/girl/1.jpg?raw=true';

export default () => (
  <>
    <ImageShadow src={src} />
  </>
);

📔 API

| Property | Description | Type | Required | Default | Version | | ------------ | ----------------------------------- | ------------- | -------- | ------- | ------- | | alt | The alt of the image. | string | ✖ | - | 1.1.0 | | className | Component extra class. | string | ✖ | - | 1.0.0 | | shadowBlur | The shadow blur of the image. | number | ✖ | 20 | 1.0.0 | | shadowHover | Whether to support the mouse hover. | boolean | ✖ | false | 1.0.0 | | shadowRadius | The border radius of the image. | number | ✖ | 8 | 1.0.0 | | src | The src of the image. | string | ✔ | - | 1.0.0 | | style | Component extra style. | CSSProperties | ✖ | - | 1.0.0 | | width | The width of the image. | number | ✖ | 300 | 1.0.0 |

🔨 Development

yarn
yarn start

License

MIT