Build Advanced Webstudio Sites Faster

Enhance your Webstudio workflow with Craft-compatible starter components, custom code components adapted for no-code use, and plugins.

Get a Component Built for You Explore Library

+200 creators explored Drevo Library this month

How Drevo Library Can Help?

Drevo Library helps Webstudio creators launch faster, unlock advanced features, and skip hours of repetitive setup. Use prebuilt UI components, powerful custom scripts, and flexible plugins to bring complex ideas to life—without the usual friction.

Copy-Paste Components

Quickstart with ready-to-go elements and drop them directly into your Webstudio project.

Advanced Features, Simplified

Easily add filters, CMS sliders, effects, and more—all with guided setup and ready-to-use assets.

Flexible for Power Users

Every component and plugin is customizable, letting developers and designers tweak settings when needed.

Drevo Works for Every Kind of Webstudio User

Whether you’re just starting out or building at scale, Drevo adapts to your process—so you can focus on what matters:

Build visually. Ship faster.

Independent Creators & Designers

Use UI starter components and customizable effects to speed up and get your ideas live—without sacrificing design freedom.

Repeat what works. Scale delivery.

Freelancers & Agencies

Deliver clean, consistent Webstudio builds to clients—using components that save hours across projects.

Launch, validate, and iterate in hours.

Product Builders & Startup Founders

Assemble full websites or MVPs with real functionality—no headaches, no friction.

Customize Advanced Settings, 100% Optional.

Developers & Power Users

Start with no-code structures and add your own code, fine-tuning as needed.

See Drevo in Action with Real Workflows

Watch how easily you can build real projects with Drevo:

Make a Full Landing Page Wireframe

Choose all the sections you want.
Rearrange them in your preferred order, then copy all at once.
Paste in your Webstudio site.

Add a Draggable and Responsive CMS Slider

Read the instructions
Copy the CMS Slider from the Library.
Paste in your site and customize to make it your own.

Craft a Real-time Filter to any Collection

Read the instructions.
Build from scratch or clone the filters example.
Customize, test, and watch the magic!

Create a Typewriter effect without code

Add the script to your project.
Wrap in a span the text that will be typed. (Follow the instructions)
Edit the attribute values to customize.

Starter Components

Craft-compatible, responsive UI components to help you build your site faster.

Customize with your brand

Built on Craft

Up-to-date with best practices

Try Starter Components

Custom Components

Add fully functional, ready-to-use components in just a few clicks, with easy-to-follow instructions, and adapted for Webstudio.

Easy Integration

No need to code (it's already done for you)

Seamless Compatibility

Try Custom Components

Comparison Slider

Confetti

Scramble Text

This text scrambles every 4 seconds.

Text Weight Hover

You can hover over the entire text to see the effect in action. It will change the weight of the word based on the cursor position between the defined boundaries.

Plugins

A full set of customizable features to enhance your Webstudio website.

Ready for Production

Powerful and Customizable

Lightweight

Try Plugins

Testimonials

What Users Say

I’ve been an early beta-user of Drevo Library, and I can guarantee you, it will cut your website development time in half, if not more. The components are constructed to offer practical benefits of easy customization with accessibility in mind, so you end up with performant foundation blocks that work reliably for all screen sizes, leaving you with full freedom to design them your way. Needless to say, this library comes highly recommended.

Ankur Puri

Webstudio Expert

@tweetdarkpanda

I'm using Webstudio for my website projects and I've been looking for a well-structured UI library that follows the Webstudio's Craft design system standards. And here comes the Drevo Library. It has all the starting components you can ask for, plus nice custom elements, and it's updated frequently. I've been amazed by the ease of use with its single click copy/paste features. It's just a no-brainer if you're willing to push your Webstudio sites to high standards in terms of cleanliness and scalability.

Steven Thomassin

Conversion-Focused Web Designer

@steventhomassin

I must say the components you have created are amazing and very simple to use also of high quality. Love the amazing work you’ve done. Excited to see the future of drevo design 🙌🏽

Zuber Rahim

Webstudio Designer

@ZuberRahim

That's very cool 🔥. I think I'll change my CMS baserow filter to your filter

Denis Ko

No-Code Web Dev

@Den_mrt

Need a Unique Component? We’ll Build It for You!

Starts at $99/component

Get the exact functionality you need, seamlessly integrated into Webstudio.

Features:

Component crafted for your needs
Expertly Built for Webstudio
No-code minded
Fast Delivery
Performant, Optimized, and Accessible.
Post-Launch Support

Request Your Custom Build

1. Submit your idea. 2. We quote. 3. We build!

Frequently Asked Questions

About the Custom-made Components Service:

What kind of components can you build? Are there limitations?

We excel at creating client-side Webstudio components designed to elevate your site's visual appeal, user interaction, and practical functionality. This can range from animated sections and interactive cards to custom utility scripts.

Our core strength is front-end Webstudio development. While we love a challenge, we currently focus our custom component creation on solutions that don't require 3D rendering, dedicated back-end programming, or intricate server-side API integrations, allowing us to deliver top-quality work in our area of expertise.

We'll confirm feasibility for all requests during our quote process.

Can I request an adapted version of one of the existing Drevo components?

Absolutely! If you need a variation of one of our free components, we can create a custom-adapted version for you. You'll receive the ready-to-use component directly made in Webstudio, along with the complete, unminified source code for your specific adapted version, giving you full control, flexibility, and ownership.

Do I need to know how to code?

No! Everything is crafted, prioritizing no-code use. However, in cases that code might benefit the functionality, we will provide step-by-step instructions.

Do I own the component once it's built?

Yes, after delivery and full payment, the component is yours to use freely on any of your Webstudio websites. Please note, this does not extend to reselling the component, offering it as part of a template for sale, or otherwise distributing it as a standalone product.

About the Library:

Do I need to know how to code?

No! Everything was crafted, prioritizing no-code use. However, in cases that code might benefit the functionality, we have step-by-step instructions with ready-to-go examples.

Can I use Drevo Library Components and Plugins for client work?

Yes. All components and plugins are built for production use and can be used for commercial projects.

How often is new content added?

Basically, every week. Whether it's adding more components, plugins, fixes, or improvements, we're constantly updating Drevo Library to be the best it can be.