UI Kit is a VUE based Component System


You can style DOM elements: uk-ratio, uk-height-1-1 (100% Vertical Height - instead of Bootstrap Popper), uk-section, uk-grid, uk-flex. You can use this naming convention to wrap legacy Bootstrap 3 to utilize with name collisions and browser prefixing for unsupported styling tags like ratio and flex in older design templates.

Over ride UI Kit, base components with :root{--uk-primary: #23afd2; --uk-secondary: #222222;} variables. These will work with vanilla CSS. JS and side loading modules can be declarative, in VUE based CSS wrappers. Other namespaced design libraries can include ionic prefixed design components, that can also be "wrapped" and nested into DOM/Viewport managed UIKit/Vue loading development strategies.



  • em element
  • ins element
  • mark element
  • q inside a q
  • strong element
  • Link Reset
  • Text Muted
  • Text Emphasis
  • Text Primary
  • Text Secondary
  • Text Success
  • Text Warning
  • Text Danger
  • Text Meta
  • Default
  • Success
  • Warning
  • Danger
  • 1
<div class="myclass">...<div>

The blockquote element represents content that is quoted from another source, optionally with a citation which must be within a footer or cite element.


  • Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

Default

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Primary

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Secondary

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Hover

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.


Table Heading Table Heading Table Heading
Table Data Table Data Table Data
Table Data Table Data Table Data
Table Data Table Data Table Data
Table Data Table Data Table Data

Default

Primary

Success

Warning

Danger

:
:
:

2XL

X-Large

Heading L

Heading M

Heading S

Heading H1

Heading H2

Heading H3

Heading H4

Heading H5
Heading H6

Heading Divider

Heading Bullet

Heading Line


Default Lorem ipsum dolor sit amet, consectetur.

Primary Lorem ipsum dolor sit amet, consectetur.




  • List item 1
  • List item 2
  • List item 3
  • List item 1
  • List item 2
  • List item 3
  • List item 1
  • List item 2
  • List item 3
Description lists
A description text
Description lists
A description text
  • Item 1

    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.

  • Item 2

    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.

  • Item 3

    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor.
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor.
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor.
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor.

Over ride UI Kit, base components with :root{--uk-primary: #23afd2; --uk-secondary: #222222;} variables. These will work with vanilla CSS. JS and side loading modules can be declarative, in VUE based CSS wrappers. Other namespaced design libraries can include ionic prefixed design components, that can also be "wrapped" and nested into DOM/Viewport managed UIKit/Vue loading development strategies.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor.

Title

Over ride UI Kit, base components with :root{--uk-primary: #23afd2; --uk-secondary: #222222;} variables. These will work with vanilla CSS. JS and side loading modules can be declarative, in VUE based CSS wrappers. Other namespaced design libraries can include ionic prefixed design components, that can also be "wrapped" and nested into DOM/Viewport managed UIKit/Vue loading development strategies.