Boomla UI kit
Full-width blocks
Text Gallery Features Testimonials Team Pricing Call to action Alert Contact form F.A.Q. Info header Breadcrumbs Footer
Elements
Top menu Left menu Subpage list Breadcrumbs Button Button group Image shaper rectangle Image shaper circle Feature Gallery Slideshow Testimonial v1 Testimonial v2 Icon Social icon group Text Display text List Contact form Subscribe Call request Alert Separator F.A.Q. (accordion) Tabs File attachments Anchor Metadata Google Analytics Powered by Boomla
Layouts
Grid Space Horizontal container Hero layout Paper Paper 2 Group Responsive show/hide Background Card Scroll container Page layout 1

Card

 

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elementum imperdiet.

Background color

 

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elementum imperdiet.

Background image

Note that any background color is shown ABOVE the image. This can be used as a semi-transparent overlay.

 

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elementum imperdiet.

Border on one side

 

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elementum imperdiet.

Border on all sides

 

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elementum imperdiet.

Outer spacing

The gray background color is not part of the card, it is only added to demonstrate the outer spacing applied around the card.

 

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elementum imperdiet.

Inner spacing

 

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elementum imperdiet.

Max width

 

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero.

No effects at all

 

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elementum imperdiet.

Empty

 

drop elements here