CSS Workshop — Free & Private

Specificity, grid and flexbox builders, 3D transforms, Sass and LESS compiling, PostCSS and CSS variables.

Runs 100% in your browser: your files and data never leave your device. No signup, no ads.

Tools in CSS Workshop

• CSS Specificity Calculator: Rank selectors by specificity weight
• CSS Grid Builder: Visual grid layout generator → `grid-template` code
• CSS Flexbox Playground: Interactive flexbox property explorer
• CSS Variable Inspector: Extract all custom properties from a stylesheet
• Sass / LESS → CSS Compiler: Compile preprocessor code in-browser
• CSS 3D Transform Builder: Visual 3D `transform` property generator
• PostCSS Playground: Run autoprefixer, nesting, etc. on CSS in-browser
• CSS Border-Radius Builder: 8-handle builder → CSS shorthand
• CSS Filter Playground: Brightness/contrast/blur filter combinator

More Developer Tools tools

• Regex Lab
• HTTP & API Toolkit
• Project & Config Toolkit
• UUID & ID Generators
• Developer Playground
• Auth & Identity Toolkit
• Advanced Dev Utilities

Browse all free tools