Refine Frame
Media frame that steps an image through generation stages without any layout shift.
Use Refine Frame in your project
Choose JavaScript or TypeScript and plain CSS or Tailwind. Enable JavaScript for the interactive preview, customization controls and source tabs.
npx shadcn@latest add @react-bits/RefineFrame-TS-TWRelated components
- Thought Line
Reasoning trace header with a live clock that folds its steps into one line when done.
- Call Chip
Tool-call chip whose fill wipes across as a live timer ticks, ending green or shaking red.
- Dodge Field
Wrapper that makes any child dodge the pointer until it relents and glides home.