Dial

A slider wound into a ring: one track carries a curl from a straight bar to a ring with its gap at six o'clock, min at seven and max at five. Turning anticlockwise lowers the value. Marks and ticks ride the track; the knob travels to the ce.

Library

Metal UI

Framework

React + SwiftUI

Type

ui

License

MIT

Files

• packages/metalui/src/components/dial/dial.tsx
• packages/metalui/src/motion/awake.ts
• packages/metalui/src/motion/duration.ts
• packages/metalui/src/motion/haptic.ts
• packages/metalui/src/motion/hop.ts
• packages/metalui/src/motion/indicator.tsx
• packages/metalui/src/motion/layout-effect.ts
• packages/metalui/src/motion/leave.ts

Source

https://github.com/vijayksingh/metalui

Categories

• Input Components
• React Input Components
• Tailwind CSS Input Components
• Knob Components
• React Knob Components
• Tailwind CSS Knob Components

More from Metal UI

• Accordion
• Alert dialog
• Attachment
• Avatar
• AI composer
• Availability picker
• Settings
• Share panel
• Block silhouette
• Studio week
• Task inbox
• Breadcrumbs