Cmd

Webflow Component Library

We crafted and developed over 30+ components for Webflow's layout library. Ours was the inaugural component library integrated into Webflow, available for freelancers, agencies, and businesses. Webflow approached us after catching wind of our "Zabal Sections" component library, which we've been leveraging to design and construct pages and websites at scale. Our components undergo thorough accessibility testing, are optimized for user experience, and are meticulously crafted to seamlessly integrate into any page structure.

Components

100%

Adoption

100K+

Copies

1st

Webflow library

Visit live website

Project management

UX design

UI design

Development

Styleguide

PROJECT DETAILS

Up-heading

Improving the workflow

Reusable components

Efficient, modular design for consistent UI, promoting easy updates.

Scalable
typography

Adaptable, responsive text for seamless design.

Always Flexbox Grid

Dynamic layout solutions for versatile designs.

Global Style Guide

Harmonizing design elements for brand cohesion.

Chapter 1

How it works

Go to your Webflow project

Opening up your Webflow project allows collaborators to access and contribute to components seamlessly.

Open the Layouts tab

Expand design possibilities by accessing Webflow's Layouts tab—where creativity meets flexibility for crafting dynamic and responsive web layouts.

Drag and drop sections into the Webflow designer

Effortlessly shape your vision in the Webflow designer—drag and drop sections for simple and flexible customization of your visual design.

Style sections based on your brand and styleguide

Style sections according to your brand and style guide, ensuring a cohesive and personalized online presence.

Chapter 2

Working with Components

Variables Components

Variables Components play a pivotal role in streamlining the development process, offering a systematic and efficient approach to design consistency. At Zabal Media, our close partnership with Webflow has been integral to ensuring a seamless integration of Variable Components into our workflow.

This collaboration not only empowers our team but also contributes to the broader Webflow community by facilitating quicker and enhanced website development.