UI kit and wireframe templates
Component libraries and wireframe kits for designing screens fast: buttons, forms, cards, navigation and page layouts as editable layers, from rough grey boxes to a finished design system.
Lo-fi Wireframe Kit
A 6-screen greyscale wireframe kit for planning a site or app: components with their variants, content and section blocks, an annotated desktop home page and a five-screen mobile booking flow with its error paths.PreviewUI Kit
A 6-screen design system for web apps, laid out like a Figma kit: color scales with semantic tokens and contrast ratios, a type scale, spacing, radius and elevation, then buttons, inputs, selection controls, navigation, tables, cards, modals, toasts and alerts with their variants and states.Preview
A closer look at Lo-fi Wireframe Kit.
A 6-screen greyscale wireframe kit for planning a site or app: components with their variants, content and section blocks, an annotated desktop home page and a five-screen mobile booking flow with its error paths. Here it is screen by screen.
- 1Cover and how to use: the kit's name, three steps for using it, the legend (image box, text bars, icon circle, marker) and a wireframe browser and phone from the templates
- 2Components, basics: type scale, buttons in four kinds and three sizes, form fields with hint and error, checkboxes, radios, toggles, chips, slider, desktop and mobile navigation, media placeholders, feedback states and the annotation set
- 3Components, content and data: service and booking cards, menu and people lists, a bookings table with status chips, stat tiles, empty states, bar, line and donut chart placeholders, a rating breakdown and review card, an accordion, a dialog and a bottom sheet
- 4Section blocks: twelve blocks, each at desktop (1440) and phone (390) width: six heroes (split, centred, photo, with form, video, app), features, pricing, testimonials, FAQ, a sign-up band and a footer
- 5Template, home page: a desktop home page for a bike-servicing business at two-thirds scale, with seven numbered decisions and the page goal beside it
- 6Template, booking flow: five phone screens from postcode to confirmation joined by what moves the rider on, and the three error paths (not covered, no slots, card declined)
About uI kit and wireframe templates.
Something else on your mind? Ask us in the chat, bottom right of the page.
Are these uI kit and wireframe templates free?
Yes. They open in Docsiv’s UI design app with a free account, where you can edit your copy, download it and share it with a link. The Free plan includes every Docsiv app and 500 AI credits a month.
Which app do they open in?
UI design: fIG, SVG, PNG and PDF files.
Can Docsiv AI write the uI kit and wireframe for me?
Yes. Choose Customise with Docsiv AI on any template, tell it about the client or the project, and it drafts the content in that template’s style for you to review and edit. AI uses credits; the Free plan includes 500 a month.
Can I change the design?
Yes, all of it: the colours, fonts, photos and every word, and you can add or remove pages. Your brand kit’s colours are in every colour picker.
Describe the uI kit and wireframe you need
Docsiv AI drafts it in the style of these templates, with your details in place, ready for you to edit.