ebnsina

Stopwatch

Component 5

About

A stopwatch with start/stop and lap/reset buttons that times to the hundredth of a second and marks the fastest and slowest laps, ported to React from Sina UI's Svelte component by ebnsina.

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Stopwatch to your project and fits it to your theme.

Code

How Stopwatch is used: the demo's code. The component's own source comes with a free account.

Usage.tsx

import Stopwatch from "@/components/ui/stopwatch";

export default function StopwatchDemo() {
  return (
    <div className="flex min-h-screen w-full items-center justify-center p-6">
      <Stopwatch label="Experiment timer" />
    </div>
  );
}

More by ebnsina

View all
  • Countdown Timer

    Countdown Timer

    20
  • Video Player

    Video Player

    15
  • Alarm Clock

    Alarm Clock

    15
  • Voice Note

    Voice Note

    12
  • Split Button

    Split Button

    11
  • Sortable List

    Sortable List

    10
  • Code Block

    Code Block

    5
  • Shaka Video

    Shaka Video

    1

Explore more