react-blur
v1.1.1
Published
React component for creating blurred backgrounds.
Downloads
939
Maintainers
Readme
React Blur
React component for creating blurred backgrounds using canvas.
Installation
npm install react-blur --save
Usage
import Blur from "react-blur";
Example
<Blur img="/directory/img.jpg" blurRadius={5} enableStyles>
The content.
</Blur>
For a complete example see the code in the demo branch.
Props
img
: The image path.blurRadius
: Optional. The size of the blur radius.enableStyles
: Optional. Flag to include base styles inline, omit this to easily override.shouldResize
: Optional. If the canvas should re-render on resize? Defaults to true.resizeInterval
: Optional. How fast the canvas should re-render on resize? Defaults to 128ms.
Contributing
Thanks to Quasimodo for the original stack blur algorithm.