0.1.3 • Published 5 years ago
animated-3d-card v0.1.3
ReactJS Animated 3D Card
This component lets you create a 3D card animated for ReactJS.
This style was created originally by Dev Ed in this video.
Check out the live Demo
Installation
yarn add animated-3d-card
or
npm i animated-3d-card
Usage
import Card, { DefaultButton } from "./Card";
<Card
title="My Title"
description="My Description"
image="https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png"
backgroundCircleColor="linear-gradient(to right, rgba(255, 0, 255, 0.75), rgba(0, 255, 0, 0.75) )"
>
<DefaultButton>Default Button</DefaultButton>
</Card>;
Type | Required | Default | Description | |
---|---|---|---|---|
Title | String | No | Empty String | The title to be shown |
Description | String | No | Empty String | The Description |
Children | JSX | No | Empty Div | Any additional content below the description |
Image (src) | String | No | No Image | The image above the circle |
backgroundCircleColor | String | No | linear-gradient(to right, rgba(245, 70, 66, 0.75), rgba(8, 83, 156, 0.75) ) | Background colour of the circle |