> This page is for Home.

> For clean Markdown of any page, append .md to the page URL.
> For a complete documentation index, see https://developers.webflow.com/llms.txt.
> For AI client integration (Claude Code, Cursor, etc.), connect to the MCP server at https://developers.webflow.com/_mcp/server.

# Introducing Flowkit v2

> Introducing Flowkit v2 - A comprehensive CSS framework with new naming conventions, grid system, and enhanced utilities

### New naming conventions

* **Hyphens and underscores**: Strategic use that mirrors generated CSS and defines component relationships. Hyphens separate modifiers and properties, while underscores connect main classes and component parts
* **Combo classes**: Enhanced approach to combo classes using prefixes: `is-`, `on-`, `gap-`, and responsive modifiers `tablet-`, `mobile-l-`, and `mobile-`.
* **Size scales**: Full word naming (`xsmall`, `small`, `medium`, `large`, `xlarge`)

### New grid system

* **Basic grid classes**: `grid`, `grid-1-col` through `grid-12-col`
* **Responsive behavior**: Automatic column adjustments across breakpoints
* **Spacing utilities**: Integrated gap and padding controls through combo classes
* **Alignment options**: Horizontal and vertical alignment modifiers
* **Responsive column modifiers**: Breakpoint-specific column adjustments

### Style guide

**Simplified**: All the technical documentation now is moved to the docs. Style guide keeps only top level brand styles and essential components.