Getting started

Install the package, load Open Props (optional), and drop in a <magic-datetime> tag.

Install

pnpm add magic-datetime lit
pnpm add open-props   # peer — optional but recommended

Load Open Props

<link rel="stylesheet" href="https://unpkg.com/open-props/open-props.min.css" />

Every --magic-* token has a built-in fallback, so the picker works without Open Props.

Basic usage

Live example

Output
—

Dev server

pnpm dev   # → http://localhost:5173/demo/