@bipboys/squircle
TypeScript icon, indicating that this package has built-in type declarations

0.0.5 • Public • Published

Squircle React SVG Mask


ts license

Description

React component for create Superellipse (or Squircle) mask using svg and css mask-image attribute.

Installation

npm install @bipboys/squircle

Usage

It couldn't be easier!

import Squircle from "@bipboys/squircle";

<Squircle style={{ width: 64, height: 64 }}>{/* <img /> */}</Squircle>;

Props

prop type default description
ratio1 number 0.0586 [0 ~ 0.5] width ratio
ratio2 number 0.332 [0 ~ 0.5] width ratio
pixelRatio1 number [0 ~ width/2] in pixel
pixelRatio2 number [0 ~ width/2] in pixel
children ReactNode ex.: image, etc.

Package Sidebar

Install

npm i @bipboys/squircle

Weekly Downloads

0

Version

0.0.5

License

none

Unpacked Size

14.6 kB

Total Files

14

Last publish

Collaborators

  • kamovski