Skip to content

joon610/react-card-component

Repository files navigation

Build Status myPc license

react-card-component

Don't Support this package

License

  • MIT License

Install

  npm i react-card-component

Demo & Examples

Demo

Props

glass, glassOption

  import { Card } from 'react-card-component';

  // default blur:4, transparency:0.2
  const NewCard = () => <Card glass><div>HelloWorld</div></Card>);

  const NewCard = () => <Card glass glassOption={{blur:5,transparency: 0.1}}><div>HelloWorld</div></Card>);

style

  import Card from 'react-card-component';
  const NewCard = () => <Card style={{"color":"red"}}><div>HelloWorld</div></Card>);

background

  import Card from 'react-card-component';
  const NewCard = () => <Card background={"red"}><div>HelloWorld</div></Card>);

hoverType

  type hoverMoveType = 'up' | 'left' | `right` | `down` | 'zoom'

  import Card from 'react-card-component';
  const NewCard = () => <Card hoverType={"zoom"}><div>HelloWorld</div></Card>);

bordered

  import Card from 'react-card-component';
  const NewCard = () => <Card bordered><div>HelloWorld</div></Card>);

outlined

  import Card from 'react-card-component';
  const NewCard = () => <Card outlined><div>HelloWorld</div></Card>);