Getting StartedWhat Is Dev Kit?
Documentation
What Is Dev Kit?
Overview and core capabilities of Dev Kit for Webflow.
Guide/Dev Kit v1.0.0
What Is Dev Kit?
Dev Kit is a complete developer toolbox built directly inside Webflow. It simplifies writing custom code, converting Tailwind CSS, managing design variables, organizing assets, and injecting hosted scripts without leaving your Webflow workspace.
Key Capabilities
- VS Code-Like Code Editor: Write HTML, CSS, and JavaScript with intelligent auto-completion, syntax highlighting, and instant Webflow Designer injection.
- Tailwind CSS Converter & Injector: Write utility-first Tailwind CSS with auto-suggestions, preview your components live, convert code to clean HTML/CSS, or directly inject Tailwind into Webflow.
- Advanced Variable Manager: Manage Webflow design variables visually or using JSON. Supports variable/collection duplication, mode-based value edits, name updating, and single-click bulk editing for matching variable types.
- Full-Featured Asset Manager: Upload, view, rename, and sort project assets. Supports folder navigation, moving assets between folders, copying asset URLs, bulk updating alt text, and bulk deleting.
- Hosted & Inline JavaScript: Easily inject external JavaScript using public HTTPS URLs with integrity hashes and versioning, or push inline JS scripts straight into your Webflow site.
- User Feedback & Documentation: Submit feedback or feature requests directly and follow step-by-step guides inside the interactive documentation panel.