Acrool React Flip Countdown

Features

• Flip animation for hours, minutes, and seconds
• Support endTime as countdown target
• Supports 3-digit hours: the display shows 99, and starts flipping down when the hour drops below 99
• Lightweight and easy to use

Install

yarn add @acrool/react-flip-countdown

Usage

add in your index.tsx

import "@acrool/react-flip-countdown/dist/index.css";

then in your page

import FlipCountdown from '@acrool/react-flip-countdown';

const Example = () => {
    
    return (
        <FlipCountdown endTime="2025/05/05 18:50:53"/>
    );
};

There is also a example that you can play with it:

Props

| Prop | Type | Default | Required | Description | |:----------|------------|---------|----------|-------------------------------------------------------------------------------| | endTime | string | – | Yes | Countdown target time. Accepts a date string or a format supported by dayjs |

License

MIT © Acrool