A beautiful Design System for Bootstrap 4. It's Free and Open Source.
Download HTML Star us on Github
*proudly coded by
Basic Elements
Buttons
ButtonWith icon
Pick your size
SmallRegularLarge Button
Pick your color
PrimaryInfoSuccessWarningDangerNeutral
Outline
Outline-primaryOutline-infoOutline-successOutline-warningOutline-danger
Links
Default Primary Info Success Warning Danger
Inputs
Form controls
Form controls (alternative)
Checkboxes
Unchecked
Checked
Disabled Unchecked
Disabled Checked
Radios
Unchecked
Checked
Disabled unchecked
Disabled checkbox
Toggle buttons
Sliders
100.00
200.00
400.00
Menu
With text
With icons
Navbars
Tabs
With icons
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.
Raw denim you probably haven't heard of them jean shorts Austin. Nesciunt tofu stumptown aliqua, retro synth master cleanse.
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.
Progress bars
Task completed
40%
Task completed
60%
Pagination
Navigation Pills
Labels
PrimarySuccessDangerWarningInfo
Alerts
Success! This is a success alert—check it out!×
Info! This is an info alert—check it out!×
Warning! This is a warning alert—check it out!×
Danger! This is an error alert—check it out!×
Typography
Headings
Heading 1
Argon Design System
Heading 2
Argon Design System
Heading 3
Argon Design System
Heading 4
Argon Design System
Heading 5
Argon Design System
Heading 6
Argon Design System
Display titles
Display 1
Argon Design System
Display 2
Argon Design System
Display 3
Argon Design System
Display 4
Argon Design System
Specialized titles
Heading
Argon Design System
Heading title
Argon Design System
Heading seaction
Header with small subtitle
According to the National Oceanic and Atmospheric Administration, Ted, Scambos, NSIDClead scentist, puts the potentially record maximum.
Paragraphs
Paragraph
I will be the leader of a company that ends up being worth billions of dollars, because I got the answers. I understand culture. I am the nucleus. I think that’s a responsibility that I have, to push possibilities, to show people, this is the level that things could be at.
Lead text
Quote
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.
Muted text
I will be the leader of a company that ends up being worth billions of dollars, because I got the answers...
Primary text
I will be the leader of a company that ends up being worth billions of dollars, because I got the answers...
Info text
I will be the leader of a company that ends up being worth billions of dollars, because I got the answers...
Success text
I will be the leader of a company that ends up being worth billions of dollars, because I got the answers...
Warning text
I will be the leader of a company that ends up being worth billions of dollars, because I got the answers...
Danger text
I will be the leader of a company that ends up being worth billions of dollars, because I got the answers...
Images
Image
Circle Image
Raised
Circle Raised
Javascript Components
Modals
Default
Notification
Form
Datepicker
Single date
Date range
Tooltips & Popovers
TooltipsOn leftOn topOn bottomOn right
PopoversOn leftOn topOn rightOn bottom
Bootstrap carousel
Argon Design System comes with four pre-built pages to help you get started faster. You can change the text and images and you're good to go.
Nucleo Icons
The official package contains over 21.000 icons which are looking great in combination with Argon Design System. Make sure you check all of them and use those that you like the most.
A beautiful Design System completed with examples
The Design System comes with four pre-built pages to help you get started faster. You can change the text and images and you're good to go. More importantly, looking at them will give you a picture of what you can built with this powerful Bootstrap 4 Design System.