Webflow Components

Webflow has special components for interactive elements: navbars, forms, tabs, sliders, etc. Convertex recognizes and converts them correctly.

If you are using Claude (the AI), you do not need to know the technical structure of these components. Simply ask "create a Webflow navbar" or "create a Webflow slider" and Claude generates the correct code automatically. This page is a reference for those who want to understand or write the code manually.

Supported Components

The navigation bar with logo, links, and mobile hamburger menu.

What you can ask Claude:

"Create a Webflow navbar with logo on the left, 4 links in the center, and a CTA button on the right. Hamburger menu on mobile."

Technical structure (for manual mode):

<nav class="w-nav navbar" data-collapse="medium">
  <div class="w-nav-brand">
    <a href="/">Logo</a>
  </div>
  <nav class="w-nav-menu">
    <a href="#" class="w-nav-link">Home</a>
    <a href="#" class="w-nav-link">About</a>
    <a href="#" class="w-nav-link">Contact</a>
  </nav>
  <div class="w-nav-button">
    <div class="w-icon-nav-menu"></div>
  </div>
</nav>

Key points:

data-collapse="medium" controls when the hamburger menu appears
w-nav-brand contains the logo
w-nav-menu contains the links
w-nav-button is the mobile hamburger button

Webflow Components

Supported Components

Navbar (Navigation Menu)

On this page