LightUI

Docs Github

Documentation

  • Getting Started

Components

  • Avatar
  • Alert
  • Button
  • Badge
  • Card
  • Image
  • Input
  • Typography
  • Toast
  • List

Button

Buttons allow users to perform actions and make choices with a single tap.

Default

Defualt Button is a simple button with class btn.

Sizes

The Button comes in 5 sizes with xs sm md lg and xl.

Contained Button

Contained buttons are high-emphasis, distinguished by their use of elevation and fill. They contain actions that are primary to your app. You can change the type of the button using class btn and btn-type.

Outlined Button

Contained buttons are high-emphasis, distinguished by their use of elevation and fill. They contain actions that are primary to your app. You can change the type of the button using class btn and outline-type.

Icon Button

Icon Buttons can be created, by using a SVG as a child to parent button. Use the class btn followed by btn-icon or btn-float.

You can use classicon-text while using icon and text together.

You can also use background color while using classbtn-type.
You can give fill color to button by using class icon-primary-color, icon-secondary-color,icon-red-color and icon-warning-color.

Link Button

Contained buttons are high-emphasis, distinguished by their use of elevation and fill. They contain actions that are primary to your app. You can change the type of the button using class btn and btn-type.

Badge Card