Native select

NativeSelect is a native select in the field's ink frame with the pixel chevron. It opens the system picker, which suits plain forms and phones; Select is the fully dithered one. Like the charts, it takes your theme's ink and paper, light or dark, and needs no Tailwind.

Example

import "@/components/dithercharts/controls.css"
import { NativeSelect } from "@/components/dithercharts/native-select"

<NativeSelect label="Interval" defaultValue="week">
  <option value="day">Day</option>
  <option value="week">Week</option>
  <option value="month">Month</option>
</NativeSelect>

Install

Controls install with DitherCharts Pro. See Installation to log in, then import controls.css once, e.g. in your root layout.

npx dithercharts add native-select

Props

It renders a native element, so every other attribute that element takes passes through.