[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"examples-content:\u002Fexamples\u002Fapps\u002Fcopper\u002Fcomponents":3,"content-store-meta":-1},{"canonical_path":4,"template":5,"family":6,"indexable":7,"seo":8,"breadcrumbs":12,"content":24,"app":29,"examples":53,"showcases":221,"links":222,"dates":241},"\u002Fexamples\u002Fapps\u002Fcopper\u002Fcomponents","detail","components",true,{"title":9,"description":10,"og_image":11},"Copperx UI components examples - Nicelydone","Browse Copperx UI component design examples. Preview individual interface elements and explore related component categories. Simplified payments for web3…","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fbf92b630-a498-4c79-93f5-c09606cac7ad.png",[13,16,19,22],{"label":14,"to":15},"Examples","\u002Fexamples",{"label":17,"to":18},"SaaS app design examples","\u002Fexamples\u002Fapps",{"label":20,"to":21},"Copperx design examples","\u002Fexamples\u002Fapps\u002Fcopper",{"label":23,"to":4},"Copperx UI components examples",{"title":23,"eyebrow":25,"description":26,"sections":27,"body":28},"SaaS app examples","Browse Copperx UI component design examples. Preview individual interface elements and explore related component categories. Simplified payments for web3 companies",[],[],{"title":30,"slug":31,"description":32,"logo":33,"url":34,"twitter_username":35,"categories":36},"Copperx","copper","Simplified payments for web3 companies","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fcopper-ckyjtnrs.png","https:\u002F\u002Fcopperx.io\u002F","CopperxHQ",[37,41,45,49],{"id":38,"title":39,"slug":40},36,"Finance","finance",{"id":42,"title":43,"slug":44},95,"Blockchain","blockchain",{"id":46,"title":47,"slug":48},37,"Developer APIs","developer-apis",{"id":50,"title":51,"slug":52},39,"Payments","payments",[54,69,84,95,110,120,135,150,165,180,194,209],{"uuid":55,"title":56,"description":57,"canonical_path":4,"image":11,"width":58,"height":59,"image_alt":60,"kind":61,"categories":62,"app":67},"57491047-0a35-4551-9f12-87367e9f9357","File upload dropzone","A file upload component with a dashed border dropzone, a label above, and helper text below.",968,362,"File upload dropzone from Copperx","component",[63],{"id":64,"title":65,"slug":66},188,"File upload input","file-upload-input",{"slug":31,"title":30,"logo":33,"categories":68},[],{"uuid":70,"title":71,"description":72,"canonical_path":4,"image":73,"width":74,"height":75,"image_alt":76,"kind":61,"categories":77,"app":82},"2cf6d1a1-5782-4d3e-80aa-92c0ea231495","Invoice list table","A data table displaying a list of invoices with columns for date, amount, invoice number, customer, due date, status, and a more options menu.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Feaa83cee-a404-44cb-b714-a7def734f80a.png",2688,714,"Invoice list table from Copperx",[78],{"id":79,"title":80,"slug":81},248,"Table","table-2",{"slug":31,"title":30,"logo":33,"categories":83},[],{"uuid":85,"title":86,"description":87,"canonical_path":4,"image":88,"width":74,"height":89,"image_alt":90,"kind":61,"categories":91,"app":93},"58427d77-a417-4d6c-8662-d1a4e1084e8f","Invoice summary table","A table displaying itemized invoice details, including quantity, price, and amount, followed by a subtotal and total amount due.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F4cdf51e9-c002-4530-bf02-d624ae5e9327.png",896,"Invoice summary table from Copperx",[92],{"id":79,"title":80,"slug":81},{"slug":31,"title":30,"logo":33,"categories":94},[],{"uuid":96,"title":97,"description":98,"canonical_path":4,"image":99,"width":100,"height":101,"image_alt":102,"kind":61,"categories":103,"app":108},"8c2d1774-35c4-484c-bcee-2686510fa536","Phone number input","A form field for entering a phone number, featuring a country code selector with a flag icon and a text input for the number.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F23e83181-aa69-41cd-bffc-fdf9cbcb976e.png",972,243,"Phone number input from Copperx",[104],{"id":105,"title":106,"slug":107},203,"Input phone number","input-phone-number",{"slug":31,"title":30,"logo":33,"categories":109},[],{"uuid":111,"title":56,"description":112,"canonical_path":4,"image":113,"width":114,"height":115,"image_alt":60,"kind":61,"categories":116,"app":118},"00399d62-66a7-4886-83c2-7d2debb9d025","A drag-and-drop file upload area with a dashed border, an upload icon, and text indicating accepted file types and size limits.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fcd152cf7-04dc-40f3-bceb-e3375dabfd30.png",1216,430,[117],{"id":64,"title":65,"slug":66},{"slug":31,"title":30,"logo":33,"categories":119},[],{"uuid":121,"title":122,"description":123,"canonical_path":4,"image":124,"width":125,"height":126,"image_alt":127,"kind":61,"categories":128,"app":133},"8cf6dedc-f8ef-421d-af24-042330b1ed3a","Network selection input","A form field for selecting a blockchain network, featuring a label, a management link, and a multi-select dropdown currently showing one selected network as a removable tag.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fac855a21-23d5-4cf3-9a0e-7de8edf45489.png",1220,370,"Network selection input from Copperx",[129],{"id":130,"title":131,"slug":132},252,"Input tag","input-tag",{"slug":31,"title":30,"logo":33,"categories":134},[],{"uuid":136,"title":137,"description":138,"canonical_path":4,"image":139,"width":140,"height":141,"image_alt":142,"kind":61,"categories":143,"app":148},"dc0c6f31-678e-44bd-b886-23e48d12969f","Settings toggle with description","A settings row featuring a label on the left and an active toggle switch on the right, accompanied by a status label and a detailed helper text explaining the feature.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F6ca3c604-0ea9-421c-9f08-02f3132bbf1a.png",1555,415,"Settings toggle with description from Copperx",[144],{"id":145,"title":146,"slug":147},236,"Toggle\u002FSwitch","toggle-switch",{"slug":31,"title":30,"logo":33,"categories":149},[],{"uuid":151,"title":152,"description":153,"canonical_path":4,"image":154,"width":155,"height":156,"image_alt":157,"kind":61,"categories":158,"app":163},"0bce0b4e-7902-4770-974f-5f000874107d","Sidebar Navigation","A vertical sidebar navigation menu featuring a logo, primary navigation links with icons, a nested submenu for settings, and a footer link.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fb7851d27-6921-4637-9476-2753b3ed273d.png",604,1718,"Sidebar Navigation from Copperx",[159],{"id":160,"title":161,"slug":162},209,"Vertical navigation","vertical-navigation",{"slug":31,"title":30,"logo":33,"categories":164},[],{"uuid":166,"title":167,"description":168,"canonical_path":4,"image":169,"width":170,"height":171,"image_alt":172,"kind":61,"categories":173,"app":178},"8feae9ac-c25e-4b45-909c-21726c4761c3","Testimonial Card","A testimonial card featuring a company logo, a quote from a customer, and the customer's avatar, name, and title.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F5214b25c-2570-4b9f-b592-ab3371d5b6c9.png",1070,484,"Testimonial Card from Copperx",[174],{"id":175,"title":176,"slug":177},232,"Testimonial","testimonial",{"slug":31,"title":30,"logo":33,"categories":179},[],{"uuid":181,"title":182,"description":183,"canonical_path":4,"image":184,"width":125,"height":185,"image_alt":186,"kind":61,"categories":187,"app":192},"c90b05ea-f43b-4dfe-9fde-be3b071b750e","Product Selection Radio Group","A vertical list of selectable product cards acting as a radio group. Each card includes an icon, title, description, and a radio button indicator. The first option is currently selected.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F8f018268-21a9-4de1-9066-2ef65fb372fb.png",1366,"Product Selection Radio Group from Copperx",[188],{"id":189,"title":190,"slug":191},216,"Radio button","radio-button",{"slug":31,"title":30,"logo":33,"categories":193},[],{"uuid":195,"title":196,"description":197,"canonical_path":4,"image":198,"width":199,"height":200,"image_alt":201,"kind":61,"categories":202,"app":207},"c169c321-1eb2-4178-b917-87735f0b2947","OTP Verification Form","A form for entering a 6-digit email authentication code, with five digits currently entered and one empty slot. It includes a title, instructional text with the user's email, and a link to resend the code.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F11a3d083-ae85-40e7-8576-080ef25c8fda.png",932,427,"OTP Verification Form from Copperx",[203],{"id":204,"title":205,"slug":206},288,"Input code","input-code",{"slug":31,"title":30,"logo":33,"categories":208},[],{"uuid":210,"title":211,"description":212,"canonical_path":4,"image":213,"width":214,"height":215,"image_alt":216,"kind":61,"categories":217,"app":219},"271f8479-1e55-41a1-9f4b-e29aab9de842","Testimonial section","A section displaying customer testimonials with company logos, quotes, and author details.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fc26fb577-fb25-460d-9bd6-ffe10042869e.png",3064,1790,"Testimonial section from Copperx",[218],{"id":175,"title":176,"slug":177},{"slug":31,"title":30,"logo":33,"categories":220},[],[],[223,226,229,232,235,238],{"label":224,"to":225},"Copperx product screens","\u002Fexamples\u002Fapps\u002Fcopper\u002Fscreens",{"label":227,"to":228},"Copperx marketing pages","\u002Fexamples\u002Fapps\u002Fcopper\u002Fmarketing",{"label":230,"to":231},"Copperx user flows","\u002Fexamples\u002Fapps\u002Fcopper\u002Fflows",{"label":233,"to":234},"Finance app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Ffinance",{"label":236,"to":237},"Blockchain app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fblockchain",{"label":239,"to":240},"Developer APIs app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fdeveloper-apis",{"published_at":242,"updated_at":243},"2023-08-15T11:49:27.000Z","2026-09-16T12:10:40.000Z"]