Demo

Create modal dialogs with different styles and transitions. Usage The modal component consists of an overlay, a dialog and a close button. […]

Create a toggleable dropdown with an datepicker. Usage To create a datepicker, just add the data-uk-datepicker attribute to an <input> element. You […]

Trigger events and animations while scrolling your page. Usage The scrollspy component listens to page scrolling and triggers events based on the […]

Create a timepicker which can easily be used by selecting a time value from a pre filled dropdown. Usage To apply the […]

Provides the default style for all HTML elements. This component defines the base look of your page. It offers great typography by […]

Dynamically transition through different content panes. Usage The switcher component consists of a number of toggles and their related content items. Add […]

Place vector icons anywhere using an icon font. This component is using the fantastic Font Awesome icon font, a project by Dave […]

Create layout boxes with different styles. UIkit uses panels to outline certain sections of your content, which can be styled differently. Typically, […]

Create a fully responsive, fluid and nestable grid layout. The grid system of UIkit follows the mobile-first approach and accomodates up to […]

A basic collection of smooth animations to use within your page. Usage To apply this component, add any .uk-animation-* class to an […]