Image Box

[ux_banner height="500px" bg="28083" bg_overlay="rgba(0, 0, 0, 0.42)"] [text_box]

IMAGE BOX ELEMENT

Create amazing image boxes with unlimited style options.

[/text_box] [/ux_banner] [section] [row] [col span="4"] [ux_image_box img="28082"]

Simple Style

Some smaller text

[/ux_image_box] [/col] [col span="4"] [ux_image_box style="bounce" img="28082"]

Bounce Style

Add anything here

[/ux_image_box] [/col] [col span="4"] [ux_image_box style="badge" img="28082"]

Badge Style

You can add shortcodes here

[/ux_image_box] [/col] [col span="4"] [ux_image_box style="overlay" img="28082"]

Overlay Style

Add any elements here..

[/ux_image_box] [/col] [col span="4"] [ux_image_box style="label" img="28082"]

Label Style

Add any elements here..

[/ux_image_box] [/col] [col span="4"] [ux_image_box style="shade" img="28082"]

Shade Style

Add any elements here..

[/ux_image_box] [/col] [col span="4"] [ux_image_box style="push" img="28082" image_height="90%" text_hover="bounce"]

Push Style

Add any elements here..

[divider] [/ux_image_box] [/col] [col span="8" depth="2" depth_hover="5"] [ux_image_box style="vertical" img="28082" image_width="48"]

Vertical Style Boxed

Add any elements here..

[button text="A button" style="secondary alt-button" radius="10"] [/ux_image_box] [/col] [/row] [/section] [section] [row] [col align="center"]

Create any kind of Image box by using the options in the Page Builder.

We have created many examples here. Mix and Match effects to create your perfect Image Box

[/col] [col span="4" depth="1"] [ux_image_box img="28082" image_height="100%"]

Simple Centered Style

Some smaller text

[/ux_image_box] [/col] [col span="4"] [ux_image_box style="bounce" img="28082" image_height="100%" depth="1" text_bg="rgb(66, 66, 66)" text_color="dark"]

Bounce Style

Add anything here

[/ux_image_box] [/col] [col span="4"] [ux_image_box style="overlay" img="28082" image_height="125%" image_hover="blur" text_pos="middle" text_size="small" text_hover="zoom-in"]

Overlay Style With Blur and Zoom

Add any elements here..

[/ux_image_box] [/col] [col span="4"] [ux_image_box style="overlay" img="28082" image_height="100%"]

Circle with Blur In Effect

Add any elements here..

[/ux_image_box] [/col] [col span="4"] [ux_image_box style="shade" img="28082" image_height="116%"]

Simple Shade  Style

A beautiful box.

[button text="Quick View" style="white"] [/ux_image_box] [/col] [col span="4"] [ux_image_box style="shade" img="28082" image_height="100%" image_radius="100" image_hover="zoom" text_pos="middle" text_hover="bounce"]

Circle Image

Create this by adding radius 100% to the image.

[/ux_image_box] [/col] [/row] [/section]