@reactframe

A countdown timer that counts down to a duration or an absolute end date, with flip-cell digit transitions, a compact text mode, and an optional loop.

An accessible switch with a springy squish animation on the thumb, an optional label + helper text, and a focus ring.

A status badge with 8 tone presets, light/dark variants, 3 sizes, 6 icon styles (check, cross, minus, dot, spinner, custom), and an optional dismiss button.

An animated star rating input with half-star precision, keyboard support, a dynamic low/mid/high color range, glow effect, and an optional progress bar.

A single image split into a stacked deck of shape-clipped layers (rectangle, circle, hexagon, star, blob and more) that fans out on hover, with optional 3D cur…

A 3D tilt card that reacts to the cursor with animated conic-gradient reflections, diamond, holographic or aurora reflex styles.

A seamless scrolling text marquee with solid/gradient/outline text styles, a separator, double-row mode, edge fade, and pause-on-hover.

A Discord-style chat bubble widget with a typing simulation, quick replies, a notification popup, member/online counts, and a launch-invite send flow.

A Telegram-style chat bubble widget with a typing simulation, quick replies, a notification popup, availability status, and a launch-in-Telegram send flow.

A Facebook Messenger-style chat bubble widget with a typing simulation, quick replies, a notification popup, availability status, and a launch-in-Messenger sen…

An X (Twitter)-style DM chat bubble widget with a typing simulation, quick replies, a follows-you badge, availability status, and a notification popup.

A responsive site footer with a logo, description, social links, multi-column link groups, and a copyright line.

A minimal site footer with up to 4 link columns, a hover-underline link style, paper/glass/custom theming, and a copyright bar.

A theme-aware before/after image comparison slider with horizontal or vertical drag direction, keyboard support, and before/after labels.

A card with an animated rotating conic-gradient glow border, customizable colors, text position, and an optional background image.

A product-style image viewer, a large main frame with prev/next arrows and an image counter, backed by a click-to-jump thumbnail strip and a reset-to-first but…

A hover-reveal product card with a blurred gradient overlay, staggered title/price/description reveal, a badge, and 5 color themes.

A pill navbar that expands into a full panel of large nav links, a tagline, and social links, with a CTA button, badges, active-page highlight, and light/dark …

A responsive site header, centered nav links on desktop, a tablet CTA-only view, and a mobile hamburger dropdown panel, with active-page highlighting and optio…

A full-bleed photo testimonial slider with crossfade, slide or iris transitions, a thumbnail strip, progress lines, star ratings, and autoplay.

Avatar-and-pill testimonial marquee rows with dual-direction scrolling, a depth effect, cursor spotlight glow, and scroll-in reveal.

A profile card that flips from a photo front to a bio back on click or hover, with flip Y, flip X, spring, or fade transitions.

A realistic iPhone frame with 3D cursor tilt, a screen glare that tracks the tilt, ambient glow, and a story-style video/image player with swipe navigation and…

A realistic browser chrome frame in macOS, Windows, or mobile Safari style, with tabs, a URL bar, and a content area for an image, video, or arbitrary React ch…

A realistic Instagram post, avatar ring, swipeable multi-photo carousel, double-tap-to-like heart burst, like/comment/repost/share/save actions, and light/dark…

A realistic X (Twitter) post with a verified badge, media image, and interactive like/retweet/bookmark actions with live counts, in light or dark theme.

A full-bleed 9:16 TikTok feed mockup with a Following/For You tab bar, a side action rail (like/comment/save/share), caption overlay, sound pill, and bottom na…

A realistic LinkedIn post with a headline, media image, a reaction summary, and interactive like/repost actions with live counts, in light or dark theme.

A 3D image gallery arranged around an auto-rotating cylinder, with configurable rows/columns, tilt angle, rotation speed, and edge fade opacity.

A gallery of scattered, gently drifting image cards with random rotation, cursor repel/attract mode, pause-on-hover, and a click-to-open lightbox.

A 3D book-flow carousel where cards tilt around the active slide, with paper/glass themes and 3 title alignment styles.

Square cards fan out diagonally into a stacked deck, each inactive card rotates and offsets away from the active one, with paper/glass themes.

Large display text that tilts in 3D toward the cursor, with a layered shadow extrusion for real depth, a specular shine highlight, and idle float/breathe anima…

A circular progress indicator with ring, gauge, and dashes arc styles, scroll-triggered count-up animation, color thresholds, a comparison target marker, and a…

A card of linear progress rows, plain ratio bars, file-upload rows with icons/subtitles/shimmer, milestone ticks, and an inline variant, with scroll-triggered …

Cycling phrases that decrypt from scrambled characters into readable text, left-to-right, right-to-left, or random reveal order, with a scramble-out transition…

A canvas background with animated film-grain noise, soft color blob gradients, 7 built-in themes (or fully custom colors), drifting blob animation, and a vigne…

A before/after image reveal, a luminance-mapped halftone dot rendering on one side, the real photo on the other, dragged apart by a glowing lightsaber-style di…

A loading spinner kit with 4 variants, rotating lines, ring, dual counter-rotating ring, and bouncing dots, sharing a common color/size/speed API.

An accessible checkbox with an animated draw-in checkmark, focus ring, and optional label, helper text, required marker, and info tooltip.

An accessible, animated radio group with a springy dot, a ripple on select, focus ring, optional descriptions and a selectable card variant.

An accessible, animated custom select with a springy chevron, keyboard navigation, type-ahead, option descriptions, disabled options and a focus ring.

An accessible single or range slider with a draggable thumb, a value tooltip, optional step marks, keyboard control and a focus ring.

An accessible animated search field with a live suggestions menu, keyboard navigation, a clear button, a loading spinner and a Cmd/Ctrl+K shortcut.

A compact label tag with soft, solid and outline variants, 6 colors, 3 sizes, an optional pulsing dot, icon, count, selectable toggle state and an animated rem…

An accessible tooltip with 4 placements, auto-flip near the screen edge, a hover delay, keyboard-focus support, an arrow and an optional shortcut badge.

A loading placeholder with rect, text, circle and card presets, a shimmer or pulse animation, reduced-motion support and a built-in swap to real content when l…

An accessible tab set with underline, pill and segmented variants, a sliding animated indicator, icons, counts, arrow-key navigation and animated content panel…

An accessible breadcrumb trail with 4 separator styles, an optional home icon, animated collapse of long paths behind an expandable ellipsis, and hover tint.

An accessible pagination control with smart ellipsis ranges, a sliding animated active page, solid, soft and compact variants, previous/next buttons and option…

An accessible step indicator with horizontal and vertical layouts, numbered and minimal variants, animated progress connectors, draw-in checkmarks, an error st…

An accessible modal dialog with a blurred backdrop, focus trap, Escape and backdrop close, scroll lock, focus restore, 3 sizes and scale, slide-up and fade ani…

An accessible popover for interactive content with click or hover triggers, 4 placements and 3 alignments, auto-flip, outside-click and Escape close, an arrow …

An accessible slide-in drawer from any of 4 sides with a backdrop, focus trap, Escape and backdrop close, scroll lock, focus restore and drag-to-dismiss.

A user avatar with image, initials or icon fallback, 5 sizes, circle, rounded and square shapes, a presence status dot with pulse, an accent ring and an option…

A stacked group of avatars with photo or initials, an overflow +N bubble, hover lift with name tooltips, a spread-on-hover animation, 5 sizes and adjustable ov…

A horizontal or vertical divider with solid, dashed, dotted and gradient styles, an optional label with start, center or end position, an accent color and a dr…

An accessible accordion with single or multiple open panels, default, card and filled variants, chevron or plus indicators, smooth height animation and full ke…

A flexible content card with media, badge, title, description, action and footer slots, default, elevated, outline and filled variants, vertical or horizontal …

A keyboard key cap for showing shortcuts, with raised, flat and outline styles, 3 sizes, automatic Mac or Windows symbols, key combinations and a live press an…

A friendly empty, no-results or error placeholder with 5 icon presets, a floating icon tile, title, description and actions, in plain, card and dashed styles w…

A multi-value input that turns text into removable tags on Enter, comma or paste, with suggestions, duplicate and max limits, custom validation and an animated…

A searchable select where you type to filter options, with match highlighting, option descriptions, disabled options, a clear button, an empty state and full k…

A searchable multi-select that shows the chosen options as removable chips, with checkbox rows, select all, a selection limit, a +N overflow chip, an empty sta…

A date picker with a popover calendar: single date or range selection, month navigation, min/max and disabled dates, Today and Clear shortcuts, localized label…

A time picker with a popover of scrollable hour, minute and AM/PM columns: 12 or 24-hour clock, minute steps, min/max times, a Now shortcut and full keyboard s…

A one-time-code input with individual animated cells, paste and autofill support, numeric or alphanumeric mode, masking, grouped cells, error shake and success…

A numeric field with minus/plus steppers, press-and-hold auto repeat, min/max clamping, decimal precision, prefix and suffix, thousand separators and full keyb…

A password field with an animated show/hide eye toggle, a four-segment strength meter, a live requirements checklist and a Caps Lock warning.

A phone number input with a searchable country menu: flags and calling codes, as-you-type formatting per country, paste detection for +codes, an E.164 value an…

A grouped card number, expiry and CVC field: brand detection with an animated mark, 4-4-4-4 or Amex 4-6-5 spacing, Luhn and expiry checks, and focus that moves…

A money input with a currency picker: live thousands separators for any locale, the right number of decimals per currency, an animated symbol, arrow-key steps …

A compact radio-style switch between a few options with a sliding animated thumb, solid or soft styles, icons, icon-only mode, vertical orientation and arrow-k…

A color picker with a draggable saturation/brightness area, hue and opacity sliders, hex input, preset swatches and an optional screen eyedropper, all keyboard…

A drag-and-drop file dropzone with click-to-browse, type/size/count validation, image previews, animated progress bars, retry and remove actions.

A signature field that draws smooth, pressure-aware ink, with undo, clear, a typed-signature option for people who can't draw, and PNG and SVG export in a pape…

An image cropper with a draggable, resizable crop box, aspect presets or a circle mask for avatars, keyboard nudging, drag-and-drop upload and the cropped imag…

An inline message block with info, success, warning, danger and neutral variants, three appearances, self-drawing icons, an optional action link and an animate…

A meter for a value within a known range: bar, semicircle gauge or segmented variants with threshold zones, animated counting numbers and proper meter semantic…

A Cmd/Ctrl+K command palette with fuzzy search and match highlighting, grouped results, keyboard navigation, shortcuts and a portal overlay.

A desktop-style app menubar with File/Edit/View-style dropdown menus, checkbox and radio items, submenus and full arrow-key navigation between and within menus.

A collapsible app sidebar with grouped nav sections, a sliding active-item indicator, badges, an icon-only rail mode with hover tooltips, a user footer and ful…

A macOS-style app dock with cursor-proximity magnification, running-app indicator dots, hover tooltips, separators and full keyboard navigation.

A focused alert dialog for confirming an action, with default/warning/danger variants, an async-aware confirm button with a spinner and inline error, and a saf…

A hover-triggered rich preview card with open/close delays, a hover bridge so moving into the card keeps it open, placement with collision flip, an optional ar…

A right-click context menu with checkbox and radio items, nested submenus, viewport edge clamping and full keyboard navigation.

A vertical timeline with status markers (done, active, pending, error), a connecting line, an alternating layout option, collapsible per-item detail and a scro…

A hierarchical tree with expand/collapse, tri-state checkboxes for multi-select, single-row selection, guide lines and full keyboard navigation.

A dashboard metric card with an animated count-up value, an auto-derived good/bad trend badge, an optional icon and a drawn-in sparkline.

A syntax-highlighted code block with line numbers, per-line highlighting, a filename/language header, a copy button and a collapsible fade-out for long snippet…

A semantic term/value list for specs, order summaries or profile details, with stacked, inline and grid layouts, optional icons and a hover-reveal copy button …

Resizable panels divided by draggable handles, with min/max size constraints, keyboard resizing, double-click reset, and horizontal or vertical layout.

A floating scroll-to-top button that fades in past a threshold, with an optional progress ring showing how far down the page you are.

A standalone copy-to-clipboard button with ghost/outline/solid variants, icon-only or labeled modes, a floating tooltip, and animated copied/error states.

A macOS-style terminal window that types out a scripted sequence of commands, outputs and comments, with a blinking cursor, auto-scroll and optional looping or…

Click-to-edit text that turns into an auto-sizing input with save/cancel controls, validation, async save support and a shake on error.

A container that locks its content to a fixed width/height ratio (a preset like video or square, or a custom number), auto-fitting a single image or video chil…

A scrollable container with a thin, draggable, auto-hiding custom scrollbar (vertical, horizontal or both) and edge fade masks, replacing the native browser sc…

An accessible toolbar of icon buttons, toggles, radio-style toggle groups and separators with roving-focus arrow-key navigation, a sliding hover highlight and …

A surface container with an optional header (icon, title, description, actions), body and footer, with outline, filled and elevated variants and an animated co…

A three-step eCommerce flow in one block: a cart with quantity steppers and promo code, a checkout form with an order summary, and an animated order-confirmed …

A metrics section with a concentric ring chart, a trend caption and count-up stats that enter with a blur, slide, fade or scale animation.

An eCommerce product listing block with a filter sidebar (live search, Free/Premium tiers, categories) and a responsive photo grid with New and Sale badges.

An eCommerce product page block with a switchable image gallery, color and size pickers, quantity stepper, animated add-to-cart button and Description / Specs …

An accessible button with primary, secondary, outline, and ghost variants, a spinning loading state, optional icon, and a focus ring, every color, size, and ti…

An accessible text input with outline, filled, and underline variants, label/helper/error text, a password show/hide toggle, and a focus ring, every color, siz…

An accessible textarea with outline, filled, and underline variants, label/helper/error text, optional auto-resize and a character counter, and a focus ring, e…

A form field wrapper with label, description, required or optional marker, info tooltip, character counter and animated helper, error and success messages, wit…

A rich text editor with a formatting toolbar, headings, lists, quotes, inline code and links, Markdown-style shortcuts, clean pasting from Docs and Word, and a…

A corner-anchored promo popup shaped like a torn event ticket, with 5 themes, a zigzag badge stub, immediate/delay/scroll triggers, auto-hide, and dismiss-memo…

A 2x2 grid of image cards that expand to fill the frame on click, revealing title/description/CTA, with keyboard arrow navigation between cards and swipe-to-cl…

A drag-and-drop task board with a hand-rolled pointer-based drag engine, velocity tilt, edge autoscroll, ghost drop-position indicator, priority badges, avatar…

An admin data table with sortable/filterable columns, global search, status tabs, row selection, badge/avatar/actions cell types, pagination, and light/dark/cu…

A multi-series line/area chart, smooth Catmull-Rom curves, a highlighted zone band, a reference line, endpoint value badges, and a hover crosshair with per-ser…

A stacked bar chart, up to 5 series per bar, a reference line, a peak-value annotation, and a hover tooltip breaking down each bar's segments with a running to…

A physically-simulated cloth intro reveal, drag to tear open a torn-paper layer covering an image, with breakable constraints, particle debris, frayed jagged/r…

A realistic Studio Display-style monitor mockup with an internal video/image carousel, swipe or auto-advance, slide/fade transitions, 3D cursor tilt, ambient g…

A min/max envelope chart with a nested core-range band, an actual-to-forecast line split, annotated risk zones, a reference line, and a live endpoint badge.

A multi-series radar/spider chart with ring gridlines, per-series solid or dashed strokes, optional point markers, and a hover tooltip comparing every series a…

A donut-style pie chart with a live center total, click-to-toggle legend, percentage callouts around the ring, and a hover tooltip with ARR, account count, and…

An infinite scrolling row of client/partner logos with edge fade masks, grayscale-to-color hover reveal, pause-on-hover, and a constant speed regardless of log…

Text distorted through an animated SVG noise filter, 5 presets (liquid, melt, blob, ghost, crystal), cursor-proximity intensity, and a click burst ripple.

Staggered word or character reveal text, driven by scroll progress, viewport entry, or a manual trigger, 4 animation presets, 3 stagger patterns, and word high…

A polished toast/alert notification, 5 tones, stacked or inline layout, icons, primary/secondary actions, dismiss and auto-dismiss, light/dark theme, plus a sh…

A responsive product/portfolio grid section, heading, per-card image with hover zoom and reveal overlay, category/price meta row, optional badge, and a centere…

A dotted status light with two layouts, Mesh grid and Halo rings, across three animated states (Waiting, Listening, Thinking), in four dot shapes with adjustab…

A voice-assistant pill with a canvas audio-reactive visualizer, idle/listening/speaking states, a glowing edge ring, live word-by-word transcript, optional rea…

A portrait voice-assistant card with a canvas audio-reactive curve visualizer, a mic button that grows on tap, idle/listening/speaking states, and live word-by…

An AI image-generation loader, canvas-drawn rolling topographic lines grow in and a top-to-bottom sweep reveals the finished picture, with cycling status messa…

A Dynamic Island-style AI status pill that morphs between idle, listening, thinking, working (with an unfolding step list) and done states, with a canvas-drawn…

An agent-style AI answer card, a researching/reading/writing step tracker with a progress rail, markdown-style bold and bullet text, clickable inline citations…

An AI text editor that rewrites a selected passage, streams a word-level diff review with accept/reject actions, and morphs a dock through writing, review, and…

A single video card with a pulsing glow-blob frame that morphs into a fullscreen lightbox on click, supports direct URL, YouTube, Vimeo, or uploaded files, a c…

A canvas-rendered, drag-to-scroll carousel with a curved wave layout and ambient wind/drift/magnetic card sway, click-to-open lightbox modal, autoplay, and ima…

A compact trust bar, a star rating with a helped-N-teams label above an infinite, edge-masked logo marquee.

A gamified discount popup, roll two animated 3D dice for a reward tier (with a doubles bonus), copy the code, and track rolls left across a session. Inline or …

A gamified scratch-to-win popup, drag to scratch a gold-foil canvas off a 3x3 icon grid, match three to win a reward tier with a confetti burst, copy the code,…

A premium opening-hours card, live open/closed status with a pulsing dot, a day-by-day schedule, and a Get Directions link built from an address or custom URL.

A perfectly aligned image grid with a centered glassmorphism overlay card, heading, subtitle and CTA button, with a staggered blur/slide/fade/scale entrance tr…

A QR-code card, title, description, code image, hint text and an open-link button, inline or as a corner-widget popup with a focus-trapped modal dialog.

A guest-review carousel with the Airbnb Bélo mark, aggregate rating header and CTA, above a draggable autoplaying grid of review cards.

A seller-feedback carousel with the eBay wordmark, aggregate rating header and CTA, above a draggable autoplaying grid of review cards.

A shop-review carousel with the Etsy wordmark, aggregate rating header and CTA, above a draggable autoplaying grid of review cards.

A real 3D CSS coin, click or tap to flip with a physical spin animation, a yes/no question field, flip history dots, and a heads/tails ratio readout.

A playable Tic Tac Toe board with a built-in AI opponent, animated piece placement, a drawn winning-line reveal, score tracking, and a confetti burst on a win.

A fully playable 2048, arrow-key and swipe controls, spring-animated tile merges, score and best-score tracking, and win/game-over overlays.

A canvas-rendered Snake game with three difficulty speeds, keyboard and swipe controls, a directional-eyes snake head, high-score tracking, and ready/game-over…

A classic Minesweeper with three board sizes, flood-fill reveal, right-click flagging, a live mine counter and timer, and a confetti burst on a win.

A flip-card memory matching game with animal emoji, three difficulty levels, a 3D flip animation, move/score tracking, and a win overlay.

A canvas Pong against a bot opponent, three difficulty levels, multi-round progression with a color shift and speed increase each round, keyboard and touch-dra…

A canvas endless-runner in the style of the offline dino game, pixel-drawn running dino, procedurally spawned cactus obstacles, three difficulty speeds, tap/sp…

A canvas Space Invaders, a descending grid of pixel-drawn invaders that shoot back, three difficulty levels, keyboard controls on desktop and on-screen move/fi…

A floating-action-button popup that opens a glowing 4-level platformer, jump between walls, dodge moving lava, and collect coins to finish each level, keyboard…

A gamified discount-capture widget where visitors spin a weighted SVG prize wheel for a reward, with five glass themes, a themed reveal modal and code copy, re…

A floating-action-button popup that opens a color-matching memory game, 3 difficulty levels, a live timer/move counter, best-score tracking, subtle Web Audio s…

A liquid-glass bubble that follows the pointer across the whole page, rendered with a raymarched WebGL2 metaball trail with fresnel shading and iridescent glin…

A portrait-format testimonial card with a crossfading top image strip, counter, thumbnail selector, and an animated quote with name/role, plus prev/next naviga…

A fullscreen hero gallery where inactive slides collapse into a stacked deck of thumbnails; clicking one crossfades it to full size with Ken Burns zoom, cursor…

A gamified discount-capture widget where visitors roll two 3D dice for a reward tier, with a themed reveal modal and code copy, rendered inline or as a corner-…

A centered "page not found" section: a big glitching error code, heading, description and one or two pill buttons. Follows the host site's theme by default (or…

A stacked toast notification system: toasts pile up in a layered stack that fans out on hover, with six tones including a loading state that turns into a resul…

A bell button with an unread badge that opens a notification panel: All and Unread tabs, Today and Earlier groups, unread dots, mark as read on click, mark all…

A presence and status indicator: online, away, busy, offline and live dots with an optional label, a pulsing ring for live states, and a pinned mode that sits …

A field-level validation message with error, warning, success and info states: it slides open under the field, crossfades when the text changes, shakes once wh…

A button-triggered menu with icons, keyboard shortcuts, checkbox and radio items, labelled sections, nested submenus and a highlight that slides from row to ro…

A pill navigation bar whose menus open one shared panel: it morphs to each menu's size, slides the content in from the side you moved to, and holds columns of …

A bottom navigation bar for phones: a pill slides behind the active tab and its icon bounces, with badge counts, an optional raised centre action, docked or fl…

An 'On this page' table of contents for articles and docs: it tracks the section in view, slides a marker along its rail (filling it like reading progress), in…

A sticky horizontal bar of section links (Overview, Features, Specs, Reviews) that follows the section in view with a sliding pill or underline, keeps the curr…

A language picker: a globe button whose name rolls to the new language, opening a searchable list of native names with codes and a check on the current one, or…

A group of checkboxes with a Select all row that shows a dash when only some are picked, checks that draw themselves, list or card layouts, a maximum that disa…

A mobile bottom sheet that slides up over a dimmed backdrop, rests at snap points you drag between from its handle, closes on a downward flick, and keeps its o…

An image lightbox for any grid of photos: the thumbnail morphs into the full view, then arrows, keys and swipes step through, double-click zooms and pans, a sw…

A cookie consent banner as a corner card or a bottom bar: accept all, reject all with equal weight, or open per-category switches (necessary locked on), and th…

A guided product tour: a spotlight glides from element to element over a dimmed page while a card beside it explains each one, with progress dots, Back, Next a…

An inline month calendar for picking one day, a range or several days, with event dots under their days, an agenda for the selected day, months that slide in f…

A plain, dependable carousel: drag or swipe between slides, arrows and dots, one to four slides in view, looping, and optional autoplay whose progress fills th…

A KPI card with a sparkline: the number counts to its new value, a change badge says how far it moved, range tabs swap the series with a redraw, and scrubbing …

An onboarding checklist: a progress bar and count up top, round checks that draw in and strike the step through, the next step opening by itself with its own a…

A list with an icon on every line for features, benefits and what's included: checks that draw themselves in as the rows fade up, dimmed and struck-through lin…

A feature box with an icon, title and text for features and services grids: in the card style a light follows the pointer along the border, the icon tile lifts…

A collection view that switches between a card grid and a list, with every item gliding to its new place; a sort menu reorders them with the same motion, and a…

A list people can put in their own order: drag a row by its handle and the others slide out of the way, or use the keyboard (Space to lift, arrows to move, Spa…

An org chart of people cards joined by rounded connector lines: teams open and close from a count chip under each manager, and picking someone lights up their …

Two lists side by side for moving items from one set to another, such as available and granted permissions: tick items and send them across with the arrows (or…

A table whose rows nest, like files in folders: open and close branches with a chevron, parents add up their children (folder sizes), sort any column with fold…

Chat message bubbles for both sides of a conversation: runs from the same person group together with tight inner corners and one avatar, outgoing messages show…

A framed group of rows for settings menus and navigation lists: icons, descriptions, count badges, a danger row for destructive actions, and in selectable mode…

A clean, semantic table for showing data as it is: plain, striped or bordered, comfortable or compact, a caption and a totals row, custom cells such as status …

A quote with its author: a rule on the left, a large quotation mark, a framed card or a big centred pull quote, revealed as it scrolls into view with a highlig…

A masonry layout for tiles of different heights: each tile drops into the shortest column while keeping left-to-right order, the column count follows the conta…

A bento layout of feature cells that span columns and rows, fall back to two and then one column as the container narrows, fade in one after another, and light…

A site header that stays out of the way: it slides up while you scroll down and comes back the moment you scroll up, turns compact and frosted after the first …

A page-section wrapper that keeps widths, padding and headings consistent: an optional eyebrow, title and description, grid, dot or glow backgrounds that fade …

SVG dividers that shape the edge between two sections: waves that drift in a seamless loop, a curve, a tilt, a peak, a zigzag or steps, layered in up to three …

A grouped form section on the native fieldset: the legend sits in a notch in the border, the group folds away to a one-line summary, a tick appears once it's c…

A light / dark switch that morphs a sun into a moon, or a Light · System · Dark control with a sliding pill; it remembers the choice, follows the OS in System …

Share buttons for X, LinkedIn, Facebook, Reddit, WhatsApp and email with a copy-link button that turns into a tick: round icons with hover labels, labelled pil…

Links to your profiles in three styles: round icons that fill from the bottom and tilt on hover, a list with handles, follower counts and an out arrow, or a do…

Reading progress in three forms: a thin spring-smoothed bar, a corner ring with the percentage that becomes a back-to-top button at the end, or a track split i…

A pay button that shows every step of a payment: the amount, a spinner while it processes, a drawn tick when it's paid, a shake and a clear message when a card…

A floating action button that opens into a short menu of actions: the plus turns into a close cross while actions spring out one after another in a line or a q…

A wrapper that brings content in as it scrolls into view: fade from any side, zoom, blur, flip or a clip-path wipe, one block at once or each child in turn, on…

Keeps keyboard focus inside a dialog, drawer or menu while it's open: Tab and Shift+Tab loop through its controls, focus starts where you choose and returns to…

A toggle button that swaps between two icons with a rotate, 3D flip, pop or slide: ready-made pairs for play/pause, mute, like, save, show/hide, menu/close, li…

A wrapper that makes any surface ripple where it's pressed: the wave grows while the pointer is held and fades when it lets go, several can overlap, icon butto…

A monthly / yearly billing switch whose price rolls to the new amount digit by digit like an odometer, with a saving badge that pops when yearly is picked and …

Text links with underlines that move: a line that slides in from the left and out to the right, opens from the centre, draws as a wave, fills behind the text, …

Masks an image into a shape (circle, squircle, arch, hexagon, flower, blob or diamond) that grows out from the centre as it scrolls into view and morphs smooth…

Readable styles for rich text from Markdown or a CMS, without a plugin: balanced headings with hover # links, comfortable line length and rhythm, lists, quotes…

Product option pickers for colour and size: round colour swatches with a ring that glides to the pick, size chips with a sliding fill, the chosen value named i…

A switch that swaps the content below it: a pill or underline thumb slides to the chosen option, the new panel slides in from that side (or fades or blurs in),…

A text field whose label sits inside it and floats up on focus or once filled, in outlined (label in a notch in the border), filled or underline styles, with a…

Joins an input with text addons, icons, a select or a button into one field with one border and one focus ring: https:// and .com around a subdomain with a liv…

A formatted text field for phone numbers, dates, times, card numbers, ZIP codes or any pattern you define: separators fill themselves in, the rest of the templ…

A rotary dial for picking a value in a range, like a mixer control: drag up or down, scroll or use the keyboard, with a 270° progress ring and a sliding thumb,…

An always-open list for picking one or several options: a search box that filters as you type, sticky group headings, avatars and descriptions, a highlight tha…

A button that stays pressed: the fill grows out from the middle, icons spin into their 'on' version, labels roll from Follow to Following and counts tick up by…

Buttons joined into one control: plain action groups like Previous / Today / Next, a single-choice group whose fill slides between options, multi-toggle groups…

A two-handle range filter with a histogram behind it: bars inside the range light up, the result count rolls as you drag, the filled part drags both ends toget…

A set of fields people can repeat: add a row, remove one, drag rows into order. Rows grow in and slide out, focus lands in the new row, Enter in the last row a…

A row of pill filters with counts: a check draws in and the chip grows to fit it, neighbours slide over instead of jumping, and a Clear chip appears once anyth…

A compact icon-only button for toolbars and table rows: solid, soft, outline or ghost, square or round, four sizes, a tooltip that names the action, a count ba…

A premium call-to-action button with a glossy face: a lit gradient, a glass highlight on the top half, a band of light that sweeps across on hover, an arrow th…

A text button that looks like a link, for secondary actions: Forgot password?, View all, Undo, Remove, Read the docs. Neutral, muted, accent or danger, an unde…

A five-face satisfaction rating for quick feedback: hand-drawn faces from a frown to a wide smile that wobble on hover, fill with their own colour and pop when…

A vertical tab menu for settings pages: tabs with icons, second-line descriptions and count badges, grouped under headings, an active highlight with a rail tha…

Dots that show where you are in a carousel or onboarding flow: the active dot stretches into a pill, a progress style fills the pill and moves on by itself lik…

A live status tracker for multi-step processes like deploys, imports and order tracking: each step is done, running, waiting or failed, the connector fills as …

A sign-in, sign-up and forgot-password card in one: social sign-in buttons, email and password fields with inline validation, a show-password toggle, a passwor…

Pricing plans side by side with a monthly / yearly switch, prices that roll when the period changes, a highlighted plan with a badge, included and excluded fea…

A frequently asked questions section: heading and contact card on the left, an animated accordion on the right, optional category tabs and search, and FAQPage …

A contact section with a heading and your email, phone and address on the left, and a validated message form on the right: topic chips, a loading state driven …