Tabler

Source code Sponsor

Last updates

Example 1
Change deprecated html tags to text decoration classes (#29604)
Example 2
justify-content:between ⇒ justify-content:space-between (#29734)
Example 3
Update change-version.js (#29736)
Example 4
Regenerate package-lock.json (#29730)
Paweł Kuna
UI Designer
Status Profile Feedback
Settings Logout
  • Home
  • Interface
    Accordion Blank page Badges New Buttons
    Cards New
    Sample cards Card actions New Cards Masonry
    Colors Data grid New Datatables New Dropdowns Modals Maps Map fullsize Vector maps New Navigation Charts Pagination
    Placeholder Steps New Stars rating New Tabs Tables Carousel New Lists Typography Offcanvas Markdown Dropzone New Lightbox New TinyMCE New Inline player New
    Authentication
    Sign in Sign in link Sign in with illustration Sign in with cover Sign up Forgot password Terms of service Lock screen
    Error pages
    404 page 500 page Maintenance page
  • Form elements
  • Extra
    Empty page Cookie banner New Activity Gallery Invoice Search results Pricing cards Pricing table FAQ New Users License
    Logs New Music Photogrid New Tasks New Uptime monitor Widgets Wizard Settings New Trial ended New Job listing New Page loader New
  • Layout
    Horizontal Boxed New Vertical Vertical transparent Right vertical Condensed Combined
    Navbar dark Navbar sticky Navbar overlap RTL mode Fluid Fluid vertical
  • 4158 icons
  • Help
    Documentation Changelog Source code Sponsor project!

Buttons

Standard Buttons

Normal
Primary
Secondary
Success
Warning
Danger
Info
Dark
Light
Active state
Primary
Secondary
Success
Warning
Danger
Info
Dark
Light
Disabled
Primary
Secondary
Success
Warning
Danger
Info
Dark
Light

Outline Buttons

Use .btn-outline-* class for outline buttons.

Normal
Primary
Secondary
Success
Warning
Danger
Info
Dark
Light
Active state
Primary
Secondary
Success
Warning
Danger
Info
Dark
Light
Disabled
Primary
Secondary
Success
Warning
Danger
Info
Dark
Light

Ghost Buttons

Use .btn-ghost-* class for ghost buttons.

Normal
Primary
Secondary
Success
Warning
Danger
Info
Dark
Light
Active state
Primary
Secondary
Success
Warning
Danger
Info
Dark
Light
Disabled
Primary
Secondary
Success
Warning
Danger
Info
Dark
Light

Square Buttons

Use .btn-square class for square buttons.

Normal
Primary
Secondary
Success
Warning
Danger
Info
Dark
Light

Pill Buttons

Use .btn-pill class for pill buttons.

Normal
Primary
Secondary
Success
Warning
Danger
Info
Dark
Light

Extra colors

Blue
Azure
Indigo
Purple
Pink
Red
Orange
Yellow
Lime
Green
Teal
Cyan

Icon buttons

Social colors

Facebook
Twitter
Google
Youtube
Vimeo
Dribbble
Github
Instagram
Pinterest
VK
RSS
Flickr
Bitbucket
Tabler
  • Documentation
  • License
  • Source code
  • Sponsor
  • Copyright © 2023 Tabler. All rights reserved.
  • v1.0.0-beta19