flip-ya-numbersdeprecated

flip your numbers

Usage no npm install needed!

<script type="module">
  import flipYaNumbers from 'https://cdn.skypack.dev/flip-ya-numbers';
</script>

README

npm version npm downloads npm npm

Make number animation looks sexy :clap:

Features:

  • Flip your nubmer in 3D space
  • Super easy to use

Install

$ yarn add flip-ya-numbers
or
$ npm install flip-ya-numbers -S

Flip your number

Quick start

import react from 'react';
import FlipNumbers from 'flip-ya-numbers';

export default function SexyComponent(props) {
    return <div>
        <FlipNumbers
            height="12px"
            width="12px"
            color="red"
            background="white"
            startAnimation
            numbers="12345"
            numberStyle={{ color: "black" }}
      />
    </div>;
}

API

Prop Type Required Description
numbers string ✓
nonNumberStyle string Css inline style for not number eg , : .
numberStyle string Css inline style for number
height number ✓ Individual number height
width number ✓ Individual number width
color string ✓ Number color
background string ✓ Background color
perspective number Css 3D transition perspective
durationSeconds number
delaySeconds number
startAnimation boolean ✓ Start the animation