Fully coded UI Kit


Uilib Components is a collection of UI components based on HTML and CSS, made for any web project. Its ready-to use 200+ components let you create amazing website and landing page easily. Moreover, its variety of components helps developers integrating complex website design.

For those who want beautiful web pages

Uilib helps you develop beautiful designed websites or landing pages easier and faster thanks to its ready to use HTML blocks and CSS classes helpers.

uilib comes with sample webpage

Stop spending time coding a button! Use Uilib

Reduce your CSS coding time. Choose among the 40+ ready-made buttons or the 200+ available components.

HTML Sample buttons
<a class="btn btn-solid-f btn-blue color-invert" href="#">
    <span class="text">Super Button</span>
</a>
<a class="btn btn-outline-e btn-black" href="#">
    <span class="text">Another Button</span>
</a>

More than 200 different components

Cards, buttons, page headers, navigation bars, inputs … 200 is just the number of provided samples, it's actually unlimited, thanks to additional CSS helper classes which let you have unlimited options.

uilib comes with sample components

Utility and helper classes

Want to change background, border, spacings or typography? Uilib brings utility and helper classes to help you modifying or building beautiful components and pages without additional CSS coding.

HTML Uilib utility classes
<div class="text-left bd-left bd-width-4 bd-blue bd-rounded-1 bg-blue-0 shadow-6 px-3 py-3 pos-rel">
    <h5 class="fs-1 mb-0 text-blue mb-1">Alert! Please, read me</h5>
    <p class="mb-0 text-blue-7 fs-1">This alert is made out of Uilib's helper classes</p>
    <div class="btns pos-abs top-2 right-2">
        <a class="btn btn-icon-d fit btn-white bg-blue bd-rounded-8 h-1p5rem w-1p5rem" href="#">
            <i class="icon ion ion-close fs-1"></i>
        </a>
    </div>
</div>
Alert! Please, read me

This alert is made out of Uilib's helper classes

HTML blocks

Uilib blocks use HTML, they are compatible with any web-based projects or any web technologies you know.

SASS Customization

Customize the color scheme, edit components CSS rules, compile only components that you need.

Extends Bootstrap 4

Uilib is based on Bootstrap, the most popular CSS grid system, making it easy to adopt.

Components


Uilib adds more than 200 new components, grouped into 7 categories, on top of existing Bootstrap components.

Cards

Card styled layout.

UI Components cards

Basic components

Buttons, inputs, form group.

UI Components basic

Item of a list

Service list item, pricing list item, feature list item.

UI Components item

Images & frames

Images, picture with text, avatar frames layouts.

UI Components image

Navigation

Navigation bar, fullscreen navigation menu.

UI Components navigation

Headers

Page header, article title, product detail page.

UI Components header

Content

Article text content.

UI Components item

Check out the demo page to see all availables components :

18 beautiful sample pages


From simple login screen to beautiful portfolio pages, the full version package includes sample pages, showing the flexibility of Uilib framework . There are in total 18 different sample pages which are landing pages, login screens, blog post pages, ecommerce pages, business pages and portfolio pages.

Uilib sample web pages

Check out the demo page to see all sample web pages :

Start a project with Uilib kit


Buy it now for a launching price of $19.99.

Or download UILIB Lite for free. It comes with two beautiful website templates : 1 landing page and 1 portfolio page.

Do you love my works? Follow me on twitter @miradontsoa or @Uilibco. You may also like these other products :