Elements
README: This page is probably a useful reference to see gaps in the theme's styling. If you see an unstyled element here, it will probably need to be styled by you to look half decent.
This Markup has been adapted from the HTML5UP Massively theme elements page using Markdown Extra and Font Awesome 4.0.3.
Text
This is bold and this is strong. This is italic and this is emphasized.
This is superscript text and this is subscript text.
This is underlined and this is code: for (;;) { ... }
.
Finally, this is a link.
Heading Level 2
Heading Level 3
Heading Level 4
Heading Level 5
Heading Level 6
Heading with a Subtitle
Lorem ipsum dolor sit amet nullam id egestas urna aliquam
Nunc lacinia ante nunc ac lobortis. Interdum adipiscing gravida odio porttitor sem non mi integer non faucibus ornare mi ut ante amet placerat aliquet. Volutpat eu sed ante lacinia sapien lorem accumsan varius montes viverra nibh in adipiscing blandit tempus accumsan.
Heading with a Subtitle
Lorem ipsum dolor sit amet nullam id egestas urna aliquam
Nunc lacinia ante nunc ac lobortis. Interdum adipiscing gravida odio porttitor sem non mi integer non faucibus ornare mi ut ante amet placerat aliquet. Volutpat eu sed ante lacinia sapien lorem accumsan varius montes viverra nibh in adipiscing blandit tempus accumsan.
Heading with a Subtitle
Lorem ipsum dolor sit amet nullam id egestas urna aliquam
Nunc lacinia ante nunc ac lobortis. Interdum adipiscing gravida odio porttitor sem non mi integer non faucibus ornare mi ut ante amet placerat aliquet. Volutpat eu sed ante lacinia sapien lorem accumsan varius montes viverra nibh in adipiscing blandit tempus accumsan.
Images
Note
- All images must be 840px width minimum to be crispy on mobile
- Full width
{.fit}
images must be 1400px width minimum to be crispy on desktop
Fit
{.fit}
.
.float-left (default)

.
Lorem ipsum dolor sit accumsan interdum nisi, quis tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent tincidunt felis sagittis eget. Lorem ipsum dolor sit accumsan interdum nisi, quis tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent. Vestibulum ante ipsum primis in faucibus magna blandit adipiscing eu felis iaculis. Vestibulum ante ipsum primis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent. Vestibulum ante ipsum primis in faucibus magna blandit adipiscing eu felis iaculis. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus magna blandit adipiscing eu felis iaculis. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod. Integer ac pellentesque praesent tincidunt felis sagittis eget.
.float-right
{.float-right}
.
Lorem ipsum dolor sit accumsan interdum nisi, quis tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent tincidunt felis sagittis eget. Lorem ipsum dolor sit accumsan interdum nisi, quis tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent. Vestibulum ante ipsum primis in faucibus magna blandit adipiscing eu felis iaculis. Vestibulum ante ipsum primis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent. Vestibulum ante ipsum primis in faucibus magna blandit adipiscing eu felis iaculis. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus magna blandit adipiscing eu felis iaculis. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus magna blandit adipiscing eu felis iaculis. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod.
Grid Gallery .box alt
Lists
Unordered
- Dolor pulvinar etiam etiam. Dolor pulvinar etiam etiam. Felis enim dolore viverra. Sagittis adipiscing eleifend.
- Felis enim dolore viverra. Dolor pulvinar etiam.
- pulvinar etiam etiam. Sagittis adipiscing eleifend.
- Felis enim dolore viverra. Dolor pulvinar etiam.
- pulvinar etiam etiam. Sagittis adipiscing eleifend.
- Felis enim dolore viverra.
- Sagittis adipiscing eleifend. Felis enim dolore viverra. Dolor pulvinar etiam etiam.
- Felis enim dolore viverra. Sagittis adipiscing eleifend. Felis enim dolore viverra. Dolor pulvinar etiam etiam.
- Dolor pulvinar etiam etiam. Sagittis adipiscing eleifend. Dolor pulvinar etiam etiam. Felis enim dolore viverra.
Ordered
- Dolor pulvinar etiam. Felis enim feugiat magna. Etiam vel felis nullam.
- Etiam vel felis at viverra. Sagittis adipiscing eleifend. Dolor pulvinar etiam etiam. Felis enim feugiat magna.
- Felis enim dolore viverra. Dolor pulvinar etiam.
- pulvinar etiam etiam. Sagittis adipiscing eleifend.
- Felis enim dolore viverra. Dolor pulvinar etiam.
- pulvinar etiam etiam. Sagittis adipiscing eleifend.
- Felis enim dolore viverra.
- Felis enim feugiat magna. Etiam vel felis nullam. Felis enim feugiat magna. Sagittis adipiscing eleifend.
- Etiam vel felis nullam. Felis enim feugiat magna. Dolor pulvinar etiam etiam.
- Sagittis adipiscing eleifend. Felis enim et tempus. Dolor pulvinar etiam etiam.
Unordered .alt
- Dolor pulvinar etiam etiam. Dolor pulvinar etiam etiam. Felis enim dolore viverra. Sagittis adipiscing eleifend.
- Felis enim dolore viverra. Dolor pulvinar etiam.
- pulvinar etiam etiam. Sagittis adipiscing eleifend.
- Felis enim dolore viverra.
- pulvinar etiam etiam. Sagittis adipiscing eleifend.
- Felis enim dolore viverra.
- pulvinar etiam etiam. Sagittis adipiscing eleifend.
Definition
- Item 1
- Lorem ipsum dolor vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent.
- Item 2
- Lorem ipsum dolor vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent.
- Item 3
- Lorem ipsum dolor vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent.
.button
.actions .button-secondary
Blockquote
Fringilla nisl. Donec accumsan interdum nisi, quis tincidunt felis sagittis eget tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan faucibus. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis.
Table
Default
Name | Description | Price |
---|---|---|
Item 1 | Ante turpis integer aliquet porttitor. | 29.99 |
Item 2 | Vis ac commodo adipiscing arcu aliquet. | 19.99 |
Item 3 | Morbi faucibus arcu accumsan lorem. | 29.99 |
Item 4 | Vitae integer tempus condimentum. | 19.99 |
Item 5 | Ante turpis integer aliquet porttitor. | 29.99 |
100.00 |
Alternate
Name | Description | Price |
---|---|---|
Item 1 | Ante turpis integer aliquet porttitor. | 29.99 |
Item 2 | Vis ac commodo adipiscing arcu aliquet. | 19.99 |
Item 3 | Morbi faucibus arcu accumsan lorem. | 29.99 |
Item 4 | Vitae integer tempus condimentum. | 19.99 |
Item 5 | Ante turpis integer aliquet porttitor. | 29.99 |
100.00 |
Form
Box
Felis sagittis eget tempus primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod. Magna sed etiam ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus lorem ipsum dolor sit amet nullam. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent. Vestibulum ante ipsum primis in faucibus magna blandit adipiscing eu felis iaculis volutpat lorem ipsum dolor.
Preformatted
i = 0;
while (!deck.isInOrder()) {
print 'Iteration ' + i;
deck.shuffle();
i++;
}
print 'It took ' + i + ' iterations to sort the deck.';
Icons Overview
- fa-sun-o
- fa-moon-o
- fa-female
- fa-male
- fa-archive
- fa-bug
- fa-glass
- fa-music
- fa-search
- fa-envelope-o
- fa-heart
- fa-star
- fa-star-o
- fa-user
- fa-film
- fa-th-large
- fa-th
- fa-th-list
- fa-check
- fa-times
- fa-search-plus
- fa-search-minus
- fa-power-off
- fa-signal
- fa-cog
- fa-trash-o
- fa-home
- fa-file-o
- fa-clock-o
- fa-road
- fa-download
- fa-arrow-circle-o-down
- fa-arrow-circle-o-up
- fa-long-arrow-down
- fa-long-arrow-up
- fa-long-arrow-left
- fa-long-arrow-right
- fa-arrow-left
- fa-arrow-right
- fa-arrow-up
- fa-arrow-down
- fa-inbox
- fa-play-circle-o
- fa-repeat
- fa-refresh
- fa-list-alt
- fa-lock
- fa-flag
- fa-headphones
- fa-volume-off
- fa-volume-down
- fa-volume-up
- fa-qrcode
- fa-barcode
- fa-tag
- fa-tags
- fa-book
- fa-bookmark
- fa-print
- fa-camera
- fa-camera-retro
- fa-video-camera
- fa-font
- fa-bold
- fa-italic
- fa-text-height
- fa-text-width
- fa-align-left
- fa-align-center
- fa-align-right
- fa-align-justify
- fa-list
- fa-outdent
- fa-indent
- fa-bars
- fa-list-ul
- fa-list-ol
- fa-strikethrough
- fa-underline
- fa-table
- fa-file
- fa-file-text
- fa-sort-alpha-asc
- fa-sort-alpha-desc
- fa-sort-amount-asc
- fa-sort-amount-desc
- fa-sort-numeric-asc
- fa-sort-numeric-desc
- fa-superscript
- fa-subscript
- fa-picture-o
- fa-pencil
- fa-map-marker
- fa-adjust
- fa-tint
- fa-pencil-square-o
- fa-share-square-o
- fa-check-square-o
- fa-arrows
- fa-step-backward
- fa-fast-backward
- fa-backward
- fa-play
- fa-pause
- fa-stop
- fa-forward
- fa-fast-forward
- fa-step-forward
- fa-eject
- fa-chevron-left
- fa-chevron-right
- fa-plus-circle
- fa-minus-circle
- fa-times-circle
- fa-check-circle
- fa-question-circle
- fa-info-circle
- fa-crosshairs
- fa-times-circle-o
- fa-check-circle-o
- fa-ban
- fa-share
- fa-expand
- fa-compress
- fa-plus
- fa-minus
- fa-asterisk
- fa-exclamation-circle
- fa-gift
- fa-leaf
- fa-fire
- fa-eye
- fa-eye-slash
- fa-exclamation-triangle
- fa-plane
- fa-calendar
- fa-random
- fa-magnet
- fa-chevron-up
- fa-chevron-down
- fa-retweet
- fa-shopping-cart
- fa-arrows-v
- fa-arrows-h
- fa-bar-chart-o
- fa-key
- fa-cogs
- fa-star-half
- fa-heart-o
- fa-sign-out
- fa-thumb-tack
- fa-external-link
- fa-sign-in
- fa-trophy
- fa-upload
- fa-lemon-o
- fa-phone
- fa-square-o
- fa-bookmark-o
- fa-phone-square
- fa-unlock
- fa-credit-card
- fa-rss
- fa-hdd-o
- fa-bullhorn
- fa-bell
- fa-certificate
- fa-thumbs-o-up
- fa-thumbs-o-down
- fa-thumbs-up
- fa-thumbs-down
- fa-hand-o-right
- fa-hand-o-left
- fa-hand-o-up
- fa-hand-o-down
- fa-arrow-circle-left
- fa-arrow-circle-right
- fa-arrow-circle-up
- fa-arrow-circle-down
- fa-globe
- fa-wrench
- fa-tasks
- fa-filter
- fa-briefcase
- fa-arrows-alt
- fa-users
- fa-link
- fa-cloud
- fa-flask
- fa-scissors
- fa-files-o
- fa-paperclip
- fa-floppy-o
- fa-square
- fa-magic
- fa-truck
- fa-money
- fa-angle-double-left
- fa-angle-double-right
- fa-angle-double-up
- fa-angle-double-down
- fa-angle-left
- fa-angle-right
- fa-angle-up
- fa-angle-down
- fa-caret-down
- fa-caret-up
- fa-caret-left
- fa-caret-right
- fa-sort-asc
- fa-sort-desc
- fa-columns
- fa-sort
- fa-envelope
- fa-undo
- fa-gavel
- fa-tachometer
- fa-comment
- fa-comment-o
- fa-comments
- fa-comments-o
- fa-bolt
- fa-sitemap
- fa-umbrella
- fa-clipboard
- fa-lightbulb-o
- fa-exchange
- fa-cloud-download
- fa-cloud-upload
- fa-user-md
- fa-stethoscope
- fa-suitcase
- fa-bell-o
- fa-coffee
- fa-cutlery
- fa-file-text-o
- fa-building-o
- fa-hospital-o
- fa-ambulance
- fa-medkit
- fa-fighter-jet
- fa-beer
- fa-h-square
- fa-plus-square
- fa-desktop
- fa-laptop
- fa-tablet
- fa-mobile
- fa-circle-o
- fa-quote-left
- fa-quote-right
- fa-spinner
- fa-circle
- fa-reply
- fa-folder
- fa-folder-open
- fa-folder-o
- fa-folder-open-o
- fa-smile-o
- fa-frown-o
- fa-meh-o
- fa-gamepad
- fa-keyboard-o
- fa-flag-o
- fa-flag-checkered
- fa-terminal
- fa-code
- fa-reply-all
- fa-mail-reply-all
- fa-star-half-o
- fa-location-arrow
- fa-crop
- fa-code-fork
- fa-chain-broken
- fa-question
- fa-info
- fa-exclamation
- fa-eraser
- fa-puzzle-piece
- fa-microphone
- fa-microphone-slash
- fa-shield
- fa-calendar-o
- fa-fire-extinguisher
- fa-rocket
- fa-maxcdn
- fa-chevron-circle-left
- fa-chevron-circle-right
- fa-chevron-circle-up
- fa-chevron-circle-down
- fa-html5
- fa-css3
- fa-anchor
- fa-unlock-alt
- fa-bullseye
- fa-ellipsis-h
- fa-ellipsis-v
- fa-rss-square
- fa-play-circle
- fa-ticket
- fa-minus-square
- fa-minus-square-o
- fa-level-up
- fa-level-down
- fa-check-square
- fa-pencil-square
- fa-external-link-square
- fa-share-square
- fa-compass
- fa-caret-square-o-down
- fa-caret-square-o-up
- fa-caret-square-o-right
- fa-arrow-circle-o-right
- fa-arrow-circle-o-left
- fa-caret-square-o-left
- fa-dot-circle-o
- fa-plus-square-o
- fa-wheelchair
- fa-try
- fa-eur
- fa-gbp
- fa-usd
- fa-inr
- fa-jpy
- fa-rub
- fa-krw
- fa-btc
- fa-youtube
- fa-youtube-square
- fa-xing
- fa-xing-square
- fa-youtube-play
- fa-dropbox
- fa-stack-overflow
- fa-instagram
- fa-flickr
- fa-adn
- fa-bitbucket
- fa-bitbucket-square
- fa-apple
- fa-windows
- fa-android
- fa-linux
- fa-dribbble
- fa-skype
- fa-foursquare
- fa-trello
- fa-gittip
- fa-vk
- fa-weibo
- fa-renren
- fa-pagelines
- fa-stack-exchange
- fa-vimeo-square
- fa-tumblr
- fa-tumblr-square
- fa-pinterest
- fa-pinterest-square
- fa-google-plus
- fa-google-plus-square
- fa-linkedin
- fa-linkedin-square
- fa-facebook
- fa-facebook-square
- fa-github
- fa-github-square
- fa-github-alt