How to make your website design stand out with Icons?
BOWWE tutorials
Welcome to our collection of online lessons. We’ve created these to help you learn the best practices and get the most out of BOWWE. Come back here whenever you want!

How to make your website design stand out with Icons?

Unlock the power of visual communication and enhance your website's design with captivating icons using BOWWE Builder! Icons play a crucial role in guiding users, highlighting important information, and adding aesthetic appeal to your web pages. In this tutorial, we'll guide you through the process of seamlessly integrating icons into your website design. Let’s go!

How can you showcase icons on your website?

Navigation Menu
List Of Benefits
Service Highlights
Reviews
Bullet Points
CTA Buttons
Testimonials
Feature Highlights

How to add icons in BOWWE?

1
Open your project in BOWWE
2

Go to the left side panel and find Multimedia tab in the Creator

3

Drag and drop the Icon widget on your website in an absolute or relative way

Learn more

Icons placed relatively on your website will have left and right margin property set to auto on default causing the element to center its position vertically in the container.

Position property - positioning elements on the page

4

Choose among icons available in BOWWE or go to Widget Settings and upload your custom icon

What is a SVG format?

SVG is a vector image format used for displaying graphics and images on the web. It describes shapes, lines, and colors using mathematical equations, allowing the images to be scaled without loss of quality.

 

SVG offers scalability, small file sizes, and compatibility with various devices, making it ideal for responsive web design.

5

Icons provide a familiar and intuitive way for users to interact with a website. Add a link to the widget in order to create an intuitive navigation accessible way for users to access content and perform actions

6

Go to Widget Styles to edit Icon's color, background, size and position.

Transform your static icons into dynamic masterpieces with a simple yet mesmerizing hover effect.

Hover effect - How to make an interactive website?

7

Click SAVE and PUBLISH to complete

Tip

Some of the widgets in BOWWE have a default layout that already includes icons. These are:

Congratulations!

add Icons to your website