Popularity

4.4

Growing

Activity

2.1

Stars 427

Watchers 13

Forks 50

Last Commit 2 months ago

Monthly Downloads: 0

Programming language: JavaScript

License: BSD 3-clause "New" or "Revised" License

Tags: UI Components Miscellaneous Select React React-component Component Canvas Blur Text

Latest version: v0.6.0

react-blur alternatives and similar libraries

Based on the "Miscellaneous" category.
Alternatively, view react-blur alternatives based on common mentions on social networks and blogs.

react-pdf

8.7 8.3 react-blur VS react-pdf

Display PDFs in your React app as easily as if they were images.
react-joyride

8.5 4.0 react-blur VS react-joyride

Create guided tours in your apps

Build stunning web applications quickly using Syncfusion JavaScript UI controls.

The Syncfusion JavaScript suite offers more than 65 cross-platform, responsive, and lightweight JS/HTML5 UI controls for building modern web applications.

Promo syncfusion.com

typography

8.3 4.1 react-blur VS typography

A powerful toolkit for building websites with beautiful design
react-split-pane

8.0 2.8 react-blur VS react-split-pane

React split-pane component
react-resizable-and-movable

7.8 7.5 react-blur VS react-resizable-and-movable

🖱 A resizable and draggable component for React.
react-simple-chatbot

7.4 0.0 react-blur VS react-simple-chatbot

:speech_balloon: Easy way to create conversation chats
react-designer

7.3 1.2 react-blur VS react-designer

It's not art
react-resizable-box

6.9 4.2 react-blur VS react-resizable-box

📏 A resizable component for React.
react-awesome-query-builder

6.5 8.0 react-blur VS react-awesome-query-builder

User-friendly query builder for React
react-json-tree

6.2 0.0 react-blur VS react-json-tree

React JSON Viewer Component, Extracted from redux-devtools.
react-facebook

5.5 0.0 react-blur VS react-facebook

Facebook components like a Login button, Like, Share, Chat, Comments, Page or Embedded Post
react-pdf-viewer

5.3 9.8 react-blur VS react-pdf-viewer

A React component to view a PDF document
react-avatar

5.1 1.5 react-blur VS react-avatar

Universal avatar makes it possible to fetch/generate an avatar based on the information you have about that user.
chessboardjsx

3.5 2.7 react-blur VS chessboardjsx

:black_square_button: Chessboard built for React
react-timesheet

3.4 0.0 react-blur VS react-timesheet

Time Sheet Component for React
react-images-uploader

3.3 0.0 react-blur VS react-images-uploader

React.js component for uploading images to the server
react-svg-buttons

3.1 0.0 react-blur VS react-svg-buttons

React configurable animated svg buttons
react-darkreader

2.9 7.6 react-blur VS react-darkreader

🌓 A React Hook for adding a dark / night mode to your site.
react-file-reader-input

2.4 0.0 react-blur VS react-file-reader-input

React file input component for complete control over styling and abstraction from file reading.
react-dnr

2.2 0.0 react-blur VS react-dnr

Dragable and Resizable window build with React.js
react-tabguard

1.9 0.0 react-blur VS react-tabguard

Limit tabbing within specified area with an ease
material-color-hash

1.8 0.0 react-blur VS material-color-hash

Hash strings to Material UI colors
react-autolink

1.6 0.0 react-blur VS react-autolink

An autolink mixin for React
react-apple-signin-auth

1.5 6.6 react-blur VS react-apple-signin-auth

 Apple signin for React using the official Apple JS SDK
react-swipeable-list

1.4 7.1 react-blur VS react-swipeable-list

Swipeable list component for React supporting several behaviours (e.g. iOS)
react-avatar-generator

1.4 0.0 react-blur VS react-avatar-generator

Generate fun kaleidoscope for user avatars.
react-swipe-to-delete-ios

1.2 2.1 react-blur VS react-swipe-to-delete-ios

A simple React component to reproduce the way iOS deletes an item in a list
react-filter-control

1.2 0.0 react-blur VS react-filter-control

The react UI component for building complex filter criteria
react-demo-tab

1.1 0.0 react-blur VS react-demo-tab

📑 React component to easily create demos of other components
react-advanced-news-ticker

1.0 1.2 react-blur VS react-advanced-news-ticker

A powerful, flexible, lightweight and animated vertical news ticker component for React.
react-headings

1.0 7.3 react-blur VS react-headings

Auto-increment your HTML headings (h1, h2, etc.) for improved accessibility and SEO.
react-searchbox-awesome

0.9 1.2 react-blur VS react-searchbox-awesome

The coolest searchbox for React.js!
react-customizable-chat-bot

0.7 0.0 react-blur VS react-customizable-chat-bot

Customizable chat bot library using React and Typescript
@restpace/schema-form

0.7 5.2 react-blur VS @restpace/schema-form

A React component package for generating forms based on (almost) the full power of JSON Schema
react-color-scroll

0.7 0.0 react-blur VS react-color-scroll

Blend through colors as you scroll down the page.
react-pulse-text

0.6 0.0 react-blur VS react-pulse-text

React component that allows you to animate the text you want
fastcomments-react

0.6 5.5 react-blur VS fastcomments-react

A React component for FastComments
captcha-image

0.3 0.0 react-blur VS captcha-image

A simple captcha image generator.
react-pagespeed-score

0.2 1.5 react-blur VS react-pagespeed-score

A React component for display a dial-type chart of PageSpeed Insights.

Do you think we are missing an alternative of react-blur or a related project?

Add another 'Miscellaneous' Library

Popular Comparisons

README

React Blur

React component for creating blurred backgrounds using canvas.

Live demo

[react-blur](screenshot.png)

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.

react-blur

React component to blur image backgrounds using canvas.