Edenite's Typography Core Typography Heading Text h1. Heading Secondary text h2. Heading Secondary text h3. Heading Secondary text h4. Heading Secondary text h5. Heading Secondary text h6. Heading Secondary text TIPS: Create lighter, secondary text in any heading with a generic <small> tag or the .small class. Example body text This is a lead paragraph. Make a paragraph stand out by adding .lead. Maecenas sed diam eget risus varius blandit sit amet non magna. Donec id elit non mi porta gravida at eget metus. 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. The following snippet of text is rendered as bold text. The following snippet of text is rendered as italicized text. An abbreviation of the word attribute is attr. Address Company Name 795 Folsom Ave, Suite 600 San Francisco, CA 94107 P: (123) 456-7890Full Name P: (123) 456-7890 Этот адрес электронной почты защищён от спам-ботов. У вас должен быть включен JavaScript для просмотра. Emphasis classes This is a .mute paragraph. This is a .text-primary paragraph. This is a .text-warning paragraph. This is a .text-danger paragraph. This is a .text-success paragraph. This is a .text-info paragraph. Alignment classes This is a left aligned text .text-left This is a center aligned text .text-center This is a right aligned text .text-right This is a justify aligned text which is often used in Book Design, Magazine or special Typo Pages. Create a justify aligned text with .text-justify class. Blockquotes Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante. Quote's author in Source Title Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante. Quote's author in Source Title Tags hotel booking discount location map travel Color Swatches Brand Colors #234269 Brand Primary #f87831 Brand Secondary #f0ad4e Brand Warning #d9534f Brand Danger #5bc0de Brand Info #5cb85c Brand Success Grayscale Levels #2d2d2d Gray Darker #333333 Gray Dark #555555 Gray #9e9e9e Gray Light #eeeeee Gray Lighter #fbfbfb Gray Lightest Buttons Buttons Normal Button Primary Button Warning Button Danger Button Info Button Succes Button Navigations Tabs Home Profile Disabled Dropdown Action Another action Another action In the area of graphical user interfaces (GUI), a tabbed document interface (TDI) or a Tab is one that allows multiple documents to be contained within a single window, using tabs as a navigational widget for switching between sets of documents. It is an interface style most commonly associated with web browsers, web applications, text editors, and preference panes. GUI tabs are modeled after traditional card tabs inserted in paper files or card indexes (in keeping with the desktop metaphor). In the area of graphical user interfaces (GUI), a tabbed document interface (TDI) or a Tab is one that allows multiple documents to be contained within a single window, using tabs as a navigational widget for switching between sets of documents. It is an interface style most commonly associated with web browsers, web applications, text editors, and preference panes. GUI tabs are modeled after traditional card tabs inserted in paper files or card indexes (in keeping with the desktop metaphor). In the area of graphical user interfaces (GUI), a tabbed document interface (TDI) or a Tab is one that allows multiple documents to be contained within a single window, using tabs as a navigational widget for switching between sets of documents. It is an interface style most commonly associated with web browsers, web applications, text editors, and preference panes. GUI tabs are modeled after traditional card tabs inserted in paper files or card indexes (in keeping with the desktop metaphor). In the area of graphical user interfaces (GUI), a tabbed document interface (TDI) or a Tab is one that allows multiple documents to be contained within a single window, using tabs as a navigational widget for switching between sets of documents. It is an interface style most commonly associated with web browsers, web applications, text editors, and preference panes. GUI tabs are modeled after traditional card tabs inserted in paper files or card indexes (in keeping with the desktop metaphor). Vertical Menus Active Menu Item Menu Item Menu Item Disabled Menu Item Dropdown Action Another action Something else here Separated link Inputs Input success Input error Input warning Disabled input Indicators Alerts and Notifications error message title Donec eget purus nec tellus tincidunt lacinia et sed lorem. Cras ac dignissim mauris. Duis odio diam, rutrum ut est at, scelerisque malesuada risus. sussess message title Donec eget purus nec tellus tincidunt lacinia et sed lorem. Cras ac dignissim mauris. Duis odio diam, rutrum ut est at, scelerisque malesuada risus. info message title Donec eget purus nec tellus tincidunt lacinia et sed lorem. Cras ac dignissim mauris. Duis odio diam, rutrum ut est at, scelerisque malesuada risus. warning message title Donec eget purus nec tellus tincidunt lacinia et sed lorem. Cras ac dignissim mauris. Duis odio diam, rutrum ut est at, scelerisque malesuada risus. Badges Home 42 Profile Messages 25 Notices 2 Labels Default Primary Success Info Warning Danger Misc List groups 14 Cras justo odio 2 Dapibus ac facilisis in Morbi leo risus 1 Morbi leo risus 2 Dapibus ac facilisis in 9 Cras justo odio Dapibus ac facilisis in Morbi leo risus Porta ac consectetur ac Vestibulum at eros List group item heading Donec id elit non mi porta gravida at eget metus risus varius blandit. List group item heading Donec id elit non mi porta gravida at eget metus. List group item heading Donec id elit non mi porta gravida at eget metus. Panels Panel heading Panel content Panel primary Panel content Panel success Panel content Panel warning Panel content Panel danger Panel content Panel info Panel content Wells Look, I'm in a small well! Look, I'm in a well! Look, I'm in a large well!