Web elements

Learn 3 ways hierarchy is used in Webflow projects.

Use the Navigator panel to manage element hierarchy and position.

Use sections to create separate blocks of content and divide the page into meaningful segments.

Use containers to keep your content centered and legible.

Use columns to place and organize content side-by-side horizontally. In Webflow, you can add columns, change their layout, and create responsive layouts.

An overview of the Div block — the most basic and versatile element in site building.

An overview of the button element.

Style your website buttons with advanced styling.

Learn how to use Link blocks to turn any element, like an image, or any layout, like a banner, into a link.

Add, nest, and style text links.

Use Headings to guide people and search engines through your content.

Use the Paragraph element to add, style, and format inline text.

Use a Rich Text Element (RTE) to create long-form content.

Add generic text using text blocks.

Add and style a block quote, which lets you use quotations such as excerpts from books or articles in your website.

Use the List element to create numbered or bulleted lists of content.

Use an Image element to add, edit, and style images in Webflow.

Learn about bitmap, GIF, PNG, JPEG, and SVG.

Discover how image resolution can affect the speed of your website and how you can optimize your images for better user experience.

Upload and manage all your website’s assets in the Webflow Designer.

Use Webflow’s Video element to embed videos hosted on third-party sites like YouTube or Vimeo.

Learn how to add, replace, and style a background video.

Display images or videos inside a modal that presents the media in a full-screen view using the lightbox component.

Add and configure Webflow Forms and Form notifications, and manage Form submissions.

Style and position form elements in unique ways.

Add, customize, and reuse a Navbar.

Use the navbar menu button to organize menu links on mobile devices.

Use the built-in Webflow dropdown component to add, style, and set up dropdown menus and links.

Add and style a slider to your project — one of the simplest and most powerful components in the Webflow Designer.

Use the Tabs element to add responsive, tabbed content to your Webflow project.

Combine the power of Google Maps and Webflow's map component to embed an interactive map on your site.

Add Facebook and Twitter buttons to your Webflow site.

Add custom blocks of HTML code to your site using the Embed element to unlock all kinds of custom functionality.

Check out how to use Symbols to turn any element and its children into a reusable component.