Accordion

An accordion consists of multiple collapsibles. When one collapsible in the accordion is expanded, the others are collapsed.

  • Accordion Item 1 Subtitle 1

    Chocolate cake jelly cupcake dessert. Chocolate bar lemon drops croissant candy canes caramels jelly beans lemon drops pie wypas. Faworki donut macaroon jujubes brownie cupcake topping macaroon gummies. Halvah gummi bears brownie chupa chups. Fruitcake lemon drops gingerbread cake apple pie. Pastry carrot cake pie. Brownie oat cake gummies. Bonbon soufflé jujubes soufflé biscuit.
  • Accordion Item 2 Subtitle 2
    Chocolate cake jelly cupcake dessert. Chocolate bar lemon drops croissant candy canes caramels jelly beans lemon drops pie wypas. Faworki donut macaroon jujubes brownie cupcake topping macaroon gummies. Halvah gummi bears brownie chupa chups. Fruitcake lemon drops gingerbread cake apple pie. Pastry carrot cake pie. Brownie oat cake gummies. Bonbon soufflé jujubes soufflé biscuit.
  • Accordion Item 3 Subtitle 3
    Chocolate cake jelly cupcake dessert. Chocolate bar lemon drops croissant candy canes caramels jelly beans lemon drops pie wypas. Faworki donut macaroon jujubes brownie cupcake topping macaroon gummies. Halvah gummi bears brownie chupa chups. Fruitcake lemon drops gingerbread cake apple pie. Pastry carrot cake pie. Brownie oat cake gummies. Bonbon soufflé jujubes soufflé biscuit.

Alert

Success
This is an alert.

Autocomplete

  • Afghanistan
  • Albania
  • Bahamas
  • Bahrain
  • Burundi
  • Benin
  • Bermuda
  • Brunei Darussalam
  • Bolivia
  • Cambodia
  • Cameroon
  • Denmark
  • Djibouti
  • Ecuador
  • Egypt

Badge

2

Base Styles

This is a paragraph. Using Adobe Clean Font.

Button

   

Checkbox

ColumnView

A ColumnView displays and allows the user to browse and select items in a dynamic tree structure (e.g. a filesystem or multi-level navigation). It has two modes: the miller columns pattern (default) and single column (hamburger menu-style).

Datepicker

The Datepicker component provides desktop and touch friendly for both date and time selection. The component leverages moment.js for parsing, manipulating, and formatting dates.

DragAction

DragAction does not have a visual representation.

Form Layout

CoraUI Form Layout

Heading

Heading 1

Heading 2

Heading 3

List

  1. Item 1
  2. Item 2
  3. Item 3

Modal

Show Modal

Multifield

NumberInput

NumberInput is a touch friendly numeric input control.

Popover

Click the following button to open the Popover.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus imperdiet interdum convallis.

Progress

Radio

RadioGroup

Select

SelectList

  • Africa
  • Asia
  • Australia
  • Europe
  • North America
  • South America

Slider

Ticked, filled and bound vertical range slider

Switch

OffOn

Table

Breakfast Lunch Dinner
Pop-Tart Hot Dogs Baked Salmon
Coffee Tater Tots Steamed Broccoli

TabPanel

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus imperdiet interdum convallis. Vestibulum convallis lectus ut nulla commodo gravida. Suspendisse porta arcu sit amet purus sollicitudin id gravida mi gravida.
Aenean faucibus ornare laoreet. Cras luctus purus at ipsum rhoncus et gravida diam malesuada. In ut ante sapien. Nulla fringilla hendrerit laoreet. Proin dolor dolor, suscipit vitae ultrices in, dapibus eget nulla.
This will not be shown as the corresponding tab is disabled.

TagList

  1. San Francisco
  2. Lehi
  3. Basel

Tooltip

Tooltip content

Well

This content is in a well.

Wizard

Cancel

Step 1

Step 1 Content.

Step 2

Step 2 Content.

Step 3

Step 3 Content.