Dev Design LibraryDocument Components
Dev Design Library indexes 81 document components from 15 open-source UI libraries, with the most coming from pdfcn, Tremor Blocks, uselayouts, Halaska UI and LocalMode. Each one links to its page with the source code, a live preview where available, the library license and the install command.
Event Agendapdfcn · ReactEvent Agenda PDF block (forme)
Receipt Tape PrintAmicro Micro Transitions · React
Test ResultsAI Elements · ReactDisplay test suite results with pass/fail/skip status and error details.
Receipt PrinterKokonut UI · ReactA receipt that prints line by line, then tears off and falls when you pull it, built with React.
Receipt TiersSpectrum UI · ReactPlans printed as thermal receipts with torn edges, dotted leaders, and a rubber stamp.
Page HeaderPanel UI · React NativeCover, face and actions at the top of a profile.
Thermal Receipt CardOpenSourceUI · React
Confidential Folderuselayouts · ReactA charcoal sleeve that pulls a letter out, flips it, and lands it in front of you.
Echo ReceiptKinetics · HTML/CSSAcknowledgement ripples through three trust layers
SignatureComponentry · ReactAn animated SVG signature effect that draws out text as if hand-written.
Billing Usage 01Tremor Blocks · React
Receipt PrinterUI Lab · ReactFeeds a receipt out of the slot line by line; twist it against the cutter to tear it off.
Meeting Assistant BlockLocalMode · ReactAudio upload OR pasted transcript → Transcribe → Summarize (DistilBART, maxLength 200 / minLength 60) → Extract action…
Form in a DialogFLX UI · ReactBuild an invoice while a dialog validates each line item against its own schema.
Action Receipt PatternHalaska UI · React
Event Ticketpdfcn · ReactEvent Ticket PDF block (forme)
Scan Documentuselayouts · ReactClick Scan and a page unfolds, flips, and a glowing bar reads it. Done holds, then it resets.
Billing Usage 02Tremor Blocks · React
Device Report BlockLocalMode · ReactA zero-download device capability report rendered entirely from browser APIs (useCapabilities / useStorageQuota /…
Form in a DialogFLX UI · ReactBuild an invoice while a dialog validates each line item against its own schema.
Space Deck PatternHalaska UI · React
Formpdfcn · ReactForm PDF component (forme)
Billing Usage 03Tremor Blocks · React
Gift Certificatepdfcn · ReactGift Certificate PDF block (forme)
Billing Usage 04Tremor Blocks · React
Invoice Classicpdfcn · ReactInvoice Classic PDF block (forme)
Billing Usage 05Tremor Blocks · React
Invoice Consultantpdfcn · ReactInvoice Consultant PDF block (forme)
Billing Usage 06Tremor Blocks · React
Invoice Corporatepdfcn · ReactInvoice Corporate PDF block (forme)
Billing Usage 07Tremor Blocks · React
Invoice Creativepdfcn · ReactInvoice Creative PDF block (forme)
Billing Usage 08Tremor Blocks · React
Invoice Minimalpdfcn · ReactInvoice Minimal PDF block (forme)
Billing Usage 09Tremor Blocks · React
Invoice Modernpdfcn · ReactInvoice Modern PDF block (forme)
Billing Usage 10Tremor Blocks · React
Lesson Planpdfcn · ReactLesson Plan PDF block (forme)
Medical Intake Formpdfcn · ReactMedical Intake Form PDF block (forme)
Meeting Minutespdfcn · ReactMeeting Minutes PDF block (forme)
Packing Slippdfcn · ReactPacking Slip PDF block (forme)
Page Breakpdfcn · ReactPage Break PDF component (forme)
Page Footerpdfcn · ReactPage Footer PDF component (forme)
Page Headerpdfcn · ReactPage Header PDF component (forme)
Page Numberpdfcn · ReactPage Number PDF component (forme)
Press Releasepdfcn · ReactPress Release PDF block (forme)
Report Financialpdfcn · ReactReport Financial PDF block (forme)
Report Marketingpdfcn · ReactReport Marketing PDF block (forme)
Report Operationspdfcn · ReactReport Operations PDF block (forme)
Report Securitypdfcn · ReactReport Security PDF block (forme)
Shipping Labelpdfcn · ReactShipping Label PDF block (forme)
Signaturepdfcn · ReactSignature PDF component (forme)
Watermarkpdfcn · ReactWatermark PDF component (forme)
Work Orderpdfcn · ReactWork Order PDF block (forme)
Event Agendapdfcn · ReactEvent Agenda PDF block (takumi)
Event Ticketpdfcn · ReactEvent Ticket PDF block (takumi)
Formpdfcn · ReactForm PDF component (takumi)
Gift Certificatepdfcn · ReactGift Certificate PDF block (takumi)
Invoice Classicpdfcn · ReactInvoice Classic PDF block (takumi)
Invoice Consultantpdfcn · ReactInvoice Consultant PDF block (takumi)
Invoice Corporatepdfcn · ReactInvoice Corporate PDF block (takumi)
Invoice Creativepdfcn · ReactInvoice Creative PDF block (takumi)
Invoice Minimalpdfcn · ReactInvoice Minimal PDF block (takumi)
Invoice Modernpdfcn · ReactInvoice Modern PDF block (takumi)
Lesson Planpdfcn · ReactLesson Plan PDF block (takumi)
Medical Intake Formpdfcn · ReactMedical Intake Form PDF block (takumi)
Meeting Minutespdfcn · ReactMeeting Minutes PDF block (takumi)
Packing Slippdfcn · ReactPacking Slip PDF block (takumi)
Page Breakpdfcn · ReactPage Break PDF component (takumi)
Page Footerpdfcn · ReactPage Footer PDF component (takumi)
Page Headerpdfcn · ReactPage Header PDF component (takumi)
Page Numberpdfcn · ReactPage Number PDF component (takumi)
Press Releasepdfcn · ReactPress Release PDF block (takumi)
Report Financialpdfcn · ReactReport Financial PDF block (takumi)
Report Marketingpdfcn · ReactReport Marketing PDF block (takumi)
Report Operationspdfcn · ReactReport Operations PDF block (takumi)
Report Securitypdfcn · ReactReport Security PDF block (takumi)
Shipping Labelpdfcn · ReactShipping Label PDF block (takumi)
Signaturepdfcn · ReactSignature PDF component (takumi)
Watermarkpdfcn · ReactWatermark PDF component (takumi)
Work Orderpdfcn · ReactWork Order PDF block (takumi)