Create Amazing Banners with Drag and Drop
[divider] [button text=»A button» color=»success» depth=»3″] [/text_box] [/ux_banner] [ux_banner height=»700px» bg=»8083″] [text_box width=»46″ animate=»fadeInRight» parallax=»1″ position_x=»5″]Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat….
[button text=»Buy now» color=»white»] [button text=»Learn more» color=»white» style=»outline»] [/text_box] [/ux_banner] [/ux_slider] [row v_align=»middle»] [col span=»7″] [ux_banner height=»600px» bg=»8083″ bg_pos=»44% 39%»] [text_box width=»63″ width__sm=»78″ padding=»39px» position_x=»5″ position_x__sm=»50″ text_color=»dark» bg=»rgba(255, 255, 255, 0.85)» depth=»2″]Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat….
[button text=»Simple Link» style=»link» icon=»icon-play»] [button text=»Simple Button»] [/text_box] [/ux_banner] [/col] [col span=»5″ span__sm=»12″ align=»center»]Drag And Drop Banner System
Flatsome Banners is the heart of Flatsome. Our Banner System let you create beautiful responsive banners with drag and drop.
[ux_image id=»8082″] [/col] [col span=»14″] [ux_banner height=»56.25%» height__sm=»50%» bg=»8083″ bg_overlay=»rgba(22, 20, 16, 0.18)» hover=»glow»] [text_box width=»36″ position_x=»90″]
Small Title
You can place a text box wherever you want on a Banner
[button text=»Click me!»] [/text_box] [/ux_banner] [/col] [col span=»6″ span__sm=»12″ align=»center»]Banner Focus Point™
Set a focus point on the banner and the image will adjust to mobile a tablet screens. Perfect for resposnive Websites.
[/col] [col span=»6″ span__sm=»12″] [ux_image id=»8082″ image_size=»original»] [/col] [/row] [title style=»center» text=»Banner Hover effects»] [row] [col span=»4″] [ux_banner height=»200px» bg=»8083″ bg_size=»medium» bg_overlay=»rgba(22, 20, 16, 0.18)» hover=»glow»] [text_box width=»36″]Glow
[/text_box] [/ux_banner] [/col] [col span=»4″] [ux_banner height=»200px» bg=»8083″ bg_size=»medium» bg_overlay=»rgba(22, 20, 16, 0.18)» hover=»zoom»] [text_box width=»36″]Zoom
[/text_box] [/ux_banner] [/col] [col span=»4″] [ux_banner height=»200px» bg=»8083″ bg_size=»medium» bg_overlay=»rgba(22, 20, 16, 0.18)» hover=»zoom-fade»] [text_box width=»36″]Zoom Fade
[/text_box] [/ux_banner] [/col] [col span=»4″] [ux_banner height=»200px» bg=»8083″ bg_size=»medium» bg_overlay=»rgba(22, 20, 16, 0.18)» hover=»blur»] [text_box width=»36″]Blur
[/text_box] [/ux_banner] [/col] [col span=»4″] [ux_banner height=»200px» bg=»8083″ bg_size=»medium» bg_overlay=»rgba(22, 20, 16, 0.18)» hover=»fade-in»] [text_box width=»36″]Fade In
[/text_box] [/ux_banner] [/col] [col span=»4″] [ux_banner height=»200px» bg=»8083″ bg_size=»medium» bg_overlay=»rgba(22, 20, 16, 0.18)» hover=»fade-out»] [text_box width=»36″]Fade Out
[/text_box] [/ux_banner] [/col] [col span=»4″] [ux_banner height=»200px» bg=»8083″ bg_size=»medium» bg_overlay=»rgba(22, 20, 16, 0.18)» hover=»color»] [text_box width=»36″]Add Color
[/text_box] [/ux_banner] [/col] [col span=»4″] [ux_banner height=»200px» bg=»8083″ bg_size=»medium» bg_overlay=»rgba(22, 20, 16, 0.18)» hover=»grayscale»] [text_box width=»36″]Grayscale
[/text_box] [/ux_banner] [/col] [col span=»4″] [ux_banner height=»200px» bg=»8083″ bg_size=»medium» bg_overlay=»rgba(22, 20, 16, 0.18)» hover=»overlay-add»] [text_box width=»51″]Add Overlay
Overlay can be any color
[/text_box] [/ux_banner] [/col] [/row] [row] [col span__sm=»12″]You can also combine hover effects to create amazing hover effects
[/col] [/row] [row] [col span=»6″ span__sm=»12″] [ux_banner height=»200px» bg=»8083″ bg_size=»medium» bg_overlay=»rgba(22, 20, 16, 0.18)» hover=»overlay-add» border=»3px 3px 3px 3px» border_margin=»10px 10px 10px 10px» border_hover=»zoom»] [text_box width=»51″]Add animated borders
[/text_box] [/ux_banner] [/col] [col span=»6″ span__sm=»12″] [ux_banner height=»200px» bg=»8083″ bg_size=»medium» bg_overlay=»rgba(22, 20, 16, 0.18)» hover=»overlay-add»] [text_box width=»51″]Add Overlay
Overlay can be any color
[/text_box] [/ux_banner] [/col] [/row] [ux_banner height=»500px» bg=»8083″ parallax=»2″] [text_box width=»41″]