Api Explanation

A component heavily inspired by the calendar component by mrnest . It's an interactive way for a user to get information about an API endpoint. Click on it to see information about the request and response data.

react framer-motion

Generative Text Reveal

An alternative to the usual typewriter reveal style for generative UI's showing text. It can be adapted to be used just as a text reveal to. Click the button to simulate text streaming.

react framer-motion

Database Visualiser

A (set of) component(s) that can be used to plan/visualise a database and it's relations.

react reactflow

Scroll Animation

A simple animation which emphasises text on the user's scroll. This is perfect for when your application/service will fix an issue and you want to highlight it's removal.

react framer-motion

Status Widget

A widget for visualising the status of an event. It has states for errors, warnings, successes and just general information. Click to see more information about each status.

react framer-motion lucide

Text Editor Toolbar

A toolbar for managing the state of a text editor.

react framer-motion

Input Micro-interaction

An input element with a micro-interaction for when the user types.

react framer-motion

Rich Placeholder Text Area

A text area with a placeholder which can contain elements allowing for more complete guidance for users. This works well for inputs/text areas where commands can be input or for AI prompt inputs.

react framer-motion

Collaborative Cursor

For realtime apps where multiple users can interact with the same UI. Allows users to see how others are interacting with it and interact with each other.

react framer-motion