Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer auctor in diam eget laoreet. Pellentesque vehicula dapibus augue eu efficitur. Interdum et malesuada fames ac ante ipsum primis in faucibus. Donec convallis, nibh ut varius accumsan, mauris sem tincidunt arcu, a sollicitudin neque erat non orci. Proin sed enim eu urna tempor faucibus. Donec ac facilisis nunc. Nam sit amet tristique dui. Integer laoreet ornare arcu, ac tincidunt augue lacinia vel.
Step 1
Step 2
3
Step 3
4
Step 4
5
Step 5

Default Buttons

Disabled Buttons

Outlined Buttons

Nested Dropdown Buttons

Button Sizes

Checkbox Buttons

Toggle Buttons

Vertical Button Group

Horizontal Button Group

Button Toolbars

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Heading with muted text

Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.

Example body text

Nullam quis risus eget urna mollis ornare vel eu leo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam id dolor id nibh ultricies vehicula.

This line of text is meant to be treated as fine print.

The following is rendered as bold text.

The following is rendered as italicized text.

An abbreviation of the word attribute is attr.

Emphasis classes

Fusce dapibus, tellus ac cursus commodo, tortor mauris nibh.

Nullam id dolor id nibh ultricies vehicula ut id elit.

Nullam id dolor id nibh ultricies vehicula ut id elit.

Nullam id dolor id nibh ultricies vehicula ut id elit.

Nullam id dolor id nibh ultricies vehicula ut id elit.

Etiam porta sem malesuada magna mollis euismod.

Donec ullamcorper nulla non metus auctor fringilla.

Duis mollis, est non commodo luctus, nisi erat porttitor ligula.

Maecenas sed diam eget risus varius blandit sit amet non magna.

Blockquotes

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.

Someone famous in Source Title

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.

Someone famous in Source Title

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.

Someone famous in Source Title
Type Column heading Column heading Column heading
Active Column content Column content Column content
Default Column content Column content Column content
Primary Column content Column content Column content
Secondary Column content Column content Column content
Tertiary Column content Column content Column content
Quaternary Column content Column content Column content
Success Column content Column content Column content
Danger Column content Column content Column content
Warning Column content Column content Column content
Info Column content Column content Column content
Light Column content Column content Column content
Dark Column content Column content Column content
Type Column heading Column heading Column heading
Active Column content Column content Column content
Default Column content Column content Column content
Primary Column content Column content Column content
Secondary Column content Column content Column content
Tertiary Column content Column content Column content
Quaternary Column content Column content Column content
Success Column content Column content Column content
Danger Column content Column content Column content
Warning Column content Column content Column content
Info Column content Column content Column content
Light Column content Column content Column content
Dark Column content Column content Column content
Legend
We'll never share your email with anyone else.
This is some placeholder block-level help text for the above input. It's a bit lighter and easily wraps to a new line.
This is some placeholder block-level help text for the above input. It's a bit lighter and easily wraps to a new line.
Radio buttons
Checkboxes
Success! You've done it.
Sorry, that username's taken. Try another?
$
.00
Custom forms
Upload
Upload

  ATTENTION DEVELOPERS

We are retiring Kendo components! For new applications after Tuesday, March 9, 2021, begin using the Kendo replacement components. For additional information, please refer to the email sent by our Enterprise Architect. Thank you very much for your cooperation. If you have any recommendations for additional components, please reach out to [email protected]

Bootstrap Datepicker

Bootstrap Multi-Select

Datatables

HTML tables with sorting, pagination, search, and other advanced configuration.

Name Position Office Age Start date Salary
Name Position Office Age Start date Salary
Tiger Nixon System Architect Edinburgh 61 04/25/2011 $320,800
Garrett Winters Accountant Tokyo 63 07/25/2011 $170,750
Ashton Cox Junior Technical Author San Francisco 66 01/12/2009 $86,000
Cedric Kelly Senior Javascript Developer Edinburgh 22 03/29/2012 $433,060
Airi Satou Accountant Tokyo 33 11/28/2008 $162,700
Brielle Williamson Integration Specialist New York 61 12/02/2012 $372,000
Herrod Chandler Sales Assistant San Francisco 59 08/06/2012 $137,500
Rhona Davidson Integration Specialist Tokyo 55 10/14/2010 $327,900
Colleen Hurst Javascript Developer San Francisco 39 09/15/2009 $205,500
Sonya Frost Software Engineer Edinburgh 23 12/13/2008 $103,600
Jena Gaines Office Manager London 30 12/19/2008 $90,560
Quinn Flynn Support Lead Edinburgh 22 03/03/2013 $342,000
Charde Marshall Regional Director San Francisco 36 10/16/2008 $470,600
Haley Kennedy Senior Marketing Designer London 43 12/18/2012 $313,500
Tatyana Fitzpatrick Regional Director London 19 03/17/2010 $385,750
Michael Silva Marketing Designer London 66 11/27/2012 $198,500
Paul Byrd Chief Financial Officer (CFO) New York 64 06/09/2010 $725,000
Gloria Little Systems Administrator New York 59 04/10/2009 $237,500
Bradley Greer Software Engineer London 41 10/13/2012 $132,000
Dai Rios Personnel Lead Edinburgh 35 09/26/2012 $217,500
Jenette Caldwell Development Lead New York 30 09/03/2011 $345,000
Yuri Berry Chief Marketing Officer (CMO) New York 40 06/25/2009 $675,000
Caesar Vance Pre-Sales Support New York 21 12/12/2011 $106,450
Doris Wilder Sales Assistant Sydney 23 09/20/2010 $85,600
Angelica Ramos Chief Executive Officer (CEO) London 47 10/09/2009 $1,200,000
Gavin Joyce Developer Edinburgh 42 12/22/2010 $92,575
Jennifer Chang Regional Director Singapore 28 11/14/2010 $357,650
Brenden Wagner Software Engineer San Francisco 28 06/07/2011 $206,850
Fiona Green Chief Operating Officer (COO) San Francisco 48 03/11/2010 $850,000
Shou Itou Regional Marketing Tokyo 20 08/14/2011 $163,000
Michelle House Integration Specialist Sydney 37 06/02/2011 $95,400
Suki Burks Developer London 53 10/22/2009 $114,500
Prescott Bartlett Technical Author London 27 05/07/2011 $145,000
Gavin Cortez Team Leader San Francisco 22 10/26/2008 $235,500
Martena Mccray Post-Sales support Edinburgh 46 03/09/2011 $324,050
Unity Butler Marketing Designer San Francisco 47 12/09/2009 $85,675
Howard Hatfield Office Manager San Francisco 51 12/16/2008 $164,500
Hope Fuentes Secretary San Francisco 41 02/12/2010 $109,850
Vivian Harrell Financial Controller San Francisco 62 02/14/2009 $452,500
Timothy Mooney Office Manager London 37 12/11/2008 $136,200
Jackson Bradshaw Director New York 65 09/26/2008 $645,750
Olivia Liang Support Engineer Singapore 64 02/03/2011 $234,500
Bruno Nash Software Engineer London 38 05/03/2011 $163,500
Sakura Yamamoto Support Engineer Tokyo 37 08/19/2009 $139,575
Thor Walton Developer New York 61 08/11/2013 $98,540
Finn Camacho Support Engineer San Francisco 47 07/07/2009 $87,500
Serge Baldwin Data Coordinator Singapore 64 04/09/2012 $138,575
Zenaida Frank Software Engineer New York 63 01/04/2010 $125,250
Zorita Serrano Software Engineer San Francisco 56 06/01/2012 $115,000
Jennifer Acosta Junior Javascript Developer Edinburgh 43 02/01/2013 $75,650
Cara Stevens Sales Assistant New York 46 12/06/2011 $145,600
Hermione Butler Regional Director London 47 03/21/2011 $356,250
Lael Greer Systems Administrator London 21 02/27/2009 $103,500
Jonas Alexander Developer San Francisco 30 07/14/2010 $86,500
Shad Decker Regional Director Edinburgh 51 11/13/2008 $183,000
Michael Bruce Javascript Developer Singapore 29 06/27/2011 $183,000
Donna Snider Customer Support New York 27 01/25/2011 $112,000

Raw denim you probably haven't heard of them jean shorts Austin. Nesciunt tofu stumptown aliqua, retro synth master cleanse. Mustache cliche tempor, williamsburg carles vegan helvetica. Reprehenderit butcher retro keffiyeh dreamcatcher synth. Cosby sweater eu banh mi, qui irure terry richardson ex squid. Aliquip placeat salvia cillum iphone. Seitan aliquip quis cardigan american apparel, butcher voluptate nisi qui.

Food truck fixie locavore, accusamus mcsweeney's marfa nulla single-origin coffee squid. Exercitation +1 labore velit, blog sartorial PBR leggings next level wes anderson artisan four loko farm-to-table craft beer twee. Qui photo booth letterpress, commodo enim craft beer mlkshk aliquip jean shorts ullamco ad vinyl cillum PBR. Homo nostrud organic, assumenda labore aesthetic magna delectus mollit.

Pagination

Alerts

Warning!

Best check yo self, you're not looking too good. Nulla vitae elit libero, a pharetra augue. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.

Oh snap! Change a few things up and try submitting again.
Well done! You successfully read this important alert message.
Heads up! This alert needs your attention, but it's not super important.
Oh snap! Change a few things up and try submitting again.
Well done! You successfully read this important alert message.
Well done! You successfully read this important alert message.
Well done! You successfully read this important alert message.
Heads up! This alert needs your attention, but it's not super important.

Badges

Primary Secondary Tertiary Quaternary Success Danger Warning Info Light Dark
Primary Secondary Tertiary Quaternary Success Danger Warning Info Light Dark

Basic

Contextual alternatives

Multiple bars

Striped

Animated

Hello, world!

This is a simple hero unit, a simple jumbotron-style component for calling extra attention to featured content or information.


It uses utility classes for typography and spacing to space content out within the larger container.

Learn more

List groups

Cards

Header

Primary card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Header

Secondary card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Header

Tertiary card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Header

Quaternary card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Header

Success card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Header

Danger card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Header

Warning card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Header

Info card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Header

Light card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Header

Dark card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Header

Primary card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Header

Secondary card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Header

Tertiary card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Header

Quaternary card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Header

Success card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Header

Danger card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Header

Warning card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Header

Info card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Header

Light card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Header

Dark card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Card header

Special title treatment
Support card subtitle
Card image

Some quick example text to build on the card title and make up the bulk of the card's content.

  • Cras justo odio
  • Dapibus ac facilisis in
  • Vestibulum at eros

Card title

Card subtitle

Some quick example text to build on the card title and make up the bulk of the card's content.

Card link Another link

Modals

Popovers

Tooltips

Portfolio Quarterly Performance
Q1
Q2
Q3
Q4
Supplemental files: Javascript, CSS, JSON