Blocks: whole sections, ready to paste.

Heroes, pricing, auth, dashboards and docs pieces, composed from the components.

in this shelf: 37
categories: 8
across devl: 277· 35 cut

Heroes3 Marketing8 Content5 Auth4 Empty & Error3 Dashboards4 Apps9 Filters1

Heroes3

259

Pour Hero

A hero whose headline drips in as lime liquid: drops pinch off the top edge, splash on landing and set into real, selectable type, with a droplet button that squashes and splashes when pressed.

260

Before & After Hero

A hero split down the middle: drag the handle and a messy expense spreadsheet turns into a clean, matched ledger row by row, while the headline flips from a week to an afternoon.

261

Tally Hero

A hero led by one giant figure that rolls up digit by digit as the itemised statement beneath it prints line by line, landing on a total that matches, with a period switch that re-tallies both.

Marketing8

148

Pricing Table

Three plans side by side with a monthly or yearly toggle that rolls each price into place, and a full feature table that folds out underneath.

149

Quote Wall

Customer quotes stacked in columns that drift past in opposite directions and settle the moment you stop to read one.

Built with

coss ui

The kit every devl component is built on — Base UI + Tailwind, copy-paste, open source.

Explore coss ui

—

Wordmark Ticker

A quiet strip of customer wordmarks that eases to a stop under your cursor, flings when you drag it, and pauses with a click.

151

Feature Bento

A bento grid of feature tiles, each with a tiny working demo (search, shortcuts, version history, a flow, a chart) that wakes up on hover and rests when you leave.

152

Mega Footer

A full site footer: link columns with little badges, a one-field digest signup, a live status pill, language and theme switches, a legal row, and an oversized wordmark fading into the floor.

153

An email capture that checks as you go, catches gmial-style typos, shakes once on a bad address, then morphs into a success note while your avatar joins the stack and the reader count rolls up by one.

154

Stats Band

A band of big figures that count up once when it scrolls into view, sitting on a hairline ruler that draws itself in, with labels and captions on a steady divider rhythm.

155

Versus Table

An us-versus-the-old-way comparison with one raised, highlighted column, ticks that pop in as you scroll, a header that sticks, and a phone layout that compares against one rival at a time.

Content5

156

Article Cards

A blog grid led by one large featured post, each card with drawn cover art, tags, reading time and author, lifting gently on hover while its cover drifts closer.

157

Changelog

A release timeline with sticky version tags, New / Improved / Fixed chips you can filter by, small drawn media cards instead of screenshots, and a load-more that eases older releases into place.

158

FAQ

A searchable FAQ with topic tabs and live counts, matches marked in place, answers that open on a smooth measured height, and a copy-link button on every question that deep-links straight to it.

159

Not Found

A 404 with a compass that dithers between headings until you move your mouse or start searching, plus a did-you-mean fix for the typo, inline search and popular links.

160

Team Grid

Team cards with tinted initials portraits, roles and a ticking local clock; hover, focus or tap one and a short bio with links slides over, plus a team filter and a we're-hiring card.

Auth4

161

Sign-in Card

Email and password sign-in with a peek toggle, a one-tap switch to magic links, passkey and SSO buttons, a gentle shake on errors and a calm check-your-inbox state.

162

Split Sign-up

A two-panel sign-up: the form validates as you go (live email check, password rules that tick off, a strength bar) beside a product glimpse and rotating customer quotes that fold below on phones.

163

Two-step Setup

Turn on authenticator-app 2FA in three calm steps: scan a coded QR or copy the setup key, type the six digits, then copy or download backup codes before you can finish.

164

Waitlist

A join-the-line card: your position rolls down digit by digit, a referral link to copy, and friends who sign up drop into slots while you jump toward the next wave.

Empty & Error3

273

First Project

The empty Projects page of an app: one line on what projects are for, a Create button with its shortcut, a guide link and three templates. Creating one flies the icon into the first row of a real project list.

275

Request Access

The page you hit when a doc is private: who you are signed in as, a switch-account menu, an optional note and a Request access button. It then shows who the request went to, when, and a resend that unlocks after a countdown.

276

Something Went Wrong

An app error page with a small 1-bit dithered ?! glyph, Try again that fails once with a shake and then recovers into a check, a copyable error details panel and a quiet Report this link.

Dashboards4

165

Dashboard Header

The top of a dashboard: three trend cards, a this-period-versus-last chart you can scrub day by day, and a goal ring that fills as sales come in.

166

Sales Overview

A year of sales on one page: pick a number up top and the monthly chart, best sellers and channel split all follow it, with a line or bar view to taste.

167

Billing Overview

A billing page in one glance: plan and seats, the next invoice with its cycle progress, a payment card that holds its colours in both themes, usage bars that warn near the limit, and invoices with a one-click retry.

168

Notification Matrix

Events down the side, email, push and in-app across the top: group checkboxes that go half-checked, locked security rows with a reason, edited cells that glow, and a save bar that floats in only when something changed.

Apps9

169

Kanban Board

A team board you can really work in: drag cards between columns, add one with a keystroke, filter by label, and open any card for its checklist and notes.

170

Connector Marketplace

A place to browse the apps that plug into your product: filter by category, search, and connect one through a short permissions step that shows the link being made.

171

Assistant App

A small, complete assistant with chats and projects in the sidebar, files you can attach, and replies that write themselves out word by word.

172

Checkout Summary

A checkout with generic express-pay buttons, delivery options that slide a selection ring, quantity steppers, a promo field that validates, and totals whose digits roll as anything changes.

173

Docs Layout

A docs page shell: grouped sidebar, readable article with tabbed code and callouts, a reading-progress hairline and a right-hand outline whose marker glides to the section you're reading; the sidebar becomes a drawer on phones.

174

Inbox Preview

A mail client in one block: unread dots, coloured labels, hover actions, rows you swipe to archive or mark read (with undo), j/k/e shortcuts and a reading pane that slides over the list on phones.

175

Intake Survey

A one-question-at-a-time onboarding survey: answer with A–D, a quick blink confirms your pick before the next question glides in, multi-select with a limit, an optional free-text step and an editable summary at the end.

176

Status Page

A public status page: a banner that names what's wrong, 90 days of uptime bars you can scrub with mouse or arrow keys, an incident timeline, and an inline subscribe form.

262

City Time

A local-time page for any city: a live clock whose digits roll, the sun on today's arc, your working hours against theirs with the best time to meet, and the year's clock changes, all re-computed as you switch cities.

Filters1

Built on Qnot — a fast, typed query builder for any framework. Rules stay one shape from the UI to SQL, flags and search.

Explore Qnot

on Qnot

177

Flags Console

A whole flag console in one piece: search and filter your flags, pick one to edit its targeting rules and rollout per environment, and watch a live log of requests getting their variant, with a marker the moment your change takes effect.

Heroes3

259

Pour Hero

A hero whose headline drips in as lime liquid: drops pinch off the top edge, splash on landing and set into real, selectable type, with a droplet button that squashes and splashes when pressed.

260

Before & After Hero

A hero split down the middle: drag the handle and a messy expense spreadsheet turns into a clean, matched ledger row by row, while the headline flips from a week to an afternoon.

261

Tally Hero

A hero led by one giant figure that rolls up digit by digit as the itemised statement beneath it prints line by line, landing on a total that matches, with a period switch that re-tallies both.

Marketing8

148

Pricing Table

Three plans side by side with a monthly or yearly toggle that rolls each price into place, and a full feature table that folds out underneath.

149

Quote Wall

Customer quotes stacked in columns that drift past in opposite directions and settle the moment you stop to read one.

Built with

coss ui

The kit every devl component is built on — Base UI + Tailwind, copy-paste, open source.

Explore coss ui

—

coss ui

coss.com

150

Wordmark Ticker

A quiet strip of customer wordmarks that eases to a stop under your cursor, flings when you drag it, and pauses with a click.

151

Feature Bento

A bento grid of feature tiles, each with a tiny working demo (search, shortcuts, version history, a flow, a chart) that wakes up on hover and rests when you leave.

152

Mega Footer

A full site footer: link columns with little badges, a one-field digest signup, a live status pill, language and theme switches, a legal row, and an oversized wordmark fading into the floor.

153

Newsletter CTA

154

Stats Band

A band of big figures that count up once when it scrolls into view, sitting on a hairline ruler that draws itself in, with labels and captions on a steady divider rhythm.

155

Versus Table

An us-versus-the-old-way comparison with one raised, highlighted column, ticks that pop in as you scroll, a header that sticks, and a phone layout that compares against one rival at a time.

Content5

156

Article Cards

A blog grid led by one large featured post, each card with drawn cover art, tags, reading time and author, lifting gently on hover while its cover drifts closer.

157

Changelog

A release timeline with sticky version tags, New / Improved / Fixed chips you can filter by, small drawn media cards instead of screenshots, and a load-more that eases older releases into place.

158

FAQ

A searchable FAQ with topic tabs and live counts, matches marked in place, answers that open on a smooth measured height, and a copy-link button on every question that deep-links straight to it.

159

Not Found

A 404 with a compass that dithers between headings until you move your mouse or start searching, plus a did-you-mean fix for the typo, inline search and popular links.

160

Team Grid

Team cards with tinted initials portraits, roles and a ticking local clock; hover, focus or tap one and a short bio with links slides over, plus a team filter and a we're-hiring card.

Auth4

161

Sign-in Card

Email and password sign-in with a peek toggle, a one-tap switch to magic links, passkey and SSO buttons, a gentle shake on errors and a calm check-your-inbox state.

162

Split Sign-up

A two-panel sign-up: the form validates as you go (live email check, password rules that tick off, a strength bar) beside a product glimpse and rotating customer quotes that fold below on phones.

163

Two-step Setup

Turn on authenticator-app 2FA in three calm steps: scan a coded QR or copy the setup key, type the six digits, then copy or download backup codes before you can finish.

164

Waitlist

A join-the-line card: your position rolls down digit by digit, a referral link to copy, and friends who sign up drop into slots while you jump toward the next wave.

Empty & Error3

273

First Project

275

Request Access

276

Something Went Wrong

An app error page with a small 1-bit dithered ?! glyph, Try again that fails once with a shake and then recovers into a check, a copyable error details panel and a quiet Report this link.

Dashboards4

165

Explore Qnot

on Qnot

177