javierbyte / React Blur
React component to blur image backgrounds using canvas.
Stars: ✭ 416
Programming Languages
javascript
184084 projects - #8 most used programming language
Projects that are alternatives of or similar to React Blur
Learning Roadmap
The Front-End Developer Learning Roadmap by Frontend Masters
Stars: ✭ 336 (-19.23%)
Mutual labels: frontend
Front End Handbook 2019
[Book] 2019 edition of our front-end development handbook
Stars: ✭ 3,964 (+852.88%)
Mutual labels: frontend
Filemanager
React based FileManager for browser ( + FS REST API for Node.js and Express)
Stars: ✭ 378 (-9.13%)
Mutual labels: frontend
Pingy Cli
The Simple Frontend Build Tool. No Configuration, No Plugins.
Stars: ✭ 390 (-6.25%)
Mutual labels: frontend
Chart Race React
📊 Seamless bar chart race component for React.
Stars: ✭ 406 (-2.4%)
Mutual labels: frontend
Aprenda Frontend
📚 Central de conhecimento sobre front-end
Stars: ✭ 381 (-8.41%)
Mutual labels: frontend
Hooks
FullStack | Zero Api | Using "React Hooks" to develop the back-end | Vite
Stars: ✭ 367 (-11.78%)
Mutual labels: frontend
Create React App Typescript
DEPRECATED: Create React apps using typescript with no build configuration.
Stars: ✭ 3,759 (+803.61%)
Mutual labels: frontend
Forum
🍺 Portando discussões feitas em grupos (Facebook, Google Groups, Slack, Disqus) para o GitHub Discussions
Stars: ✭ 3,868 (+829.81%)
Mutual labels: frontend
Front End Design Checklist
💎 The Design Checklist for Creative Web Designers and Patient Front-End Developers
Stars: ✭ 4,136 (+894.23%)
Mutual labels: frontend
Kashti
Kashti is a dashboard for your Brigade pipelines.
Stars: ✭ 370 (-11.06%)
Mutual labels: frontend
Vue Skeleton Mvp
VueJs, Vuetify, Vue Router and Vuex skeleton MVP written on JavaScript using async/await built to work with API REST skeleton: https://github.com/davellanedam/node-express-mongodb-jwt-rest-api-skeleton
Stars: ✭ 406 (-2.4%)
Mutual labels: frontend
Udash Core
Scala framework for building beautiful and maintainable web applications.
Stars: ✭ 405 (-2.64%)
Mutual labels: frontend
React Blur
React component for creating blurred backgrounds using canvas.
Installation
npm install react-blur --save
Usage
var Blur = require('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
Please install yarn and use it to manage dependencies and the lockfile.
Thanks to Quasimodo for the original stack blur algorithm.
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].