react-bezier-mask

Description

A ReactJS component that provides a mask using Bezier curves. There's a great article on HackerNoon about the significance of using Bezier curves for corners.

Demo

https://wle8300.github.io/react-bezier-mask/

Install

npm install --save react-bezier-mask

Usage

import React, { Component } from 'react'
 
import Mask from 'react-bezier-mask'
 
 
class Example extends Component {
  render () {
    return (
      <Mask>
        <img src="path/to/image.jpg"/>
      </Mask>
    )
  }
}

TODO

• use a solution that doesn't rely on CSS -webkit-mask to promote browser compatibility

License

MIT © wle8300