Codepen
FreeSocial development environment for front-end code. Build and share HTML/CSS/JS demos, explore thousands of community creations. The go-to for frontend prototyping and experimentation.
How to install Codepen as a PWA
More in Development Tools
Offline API documentation browser with 100+ languages and frameworks. Combines MDN, React, Node.js, Python docs into one fast, searchable interface. Works completely offline.
The best regex debugger on the web. Real-time explanation, match highlighting, test strings, and a library of saved patterns. Supports PCRE2, JavaScript, Python, Golang regex.
Google's image compression tool — compare formats (WebP, AVIF, MozJPEG) side by side with live quality sliders. All processing is client-side. A must-have for web developers.
Drag-drop SVG optimizer with live preview. Uses SVGO under the hood — remove metadata, clean paths, reduce file size by 30-80%. Essential for frontend developers.
Check the bundle size of any npm package before installing it. Enter a package name, get instant size stats (minified + gzipped). A critical tool for keeping JS bundles lean.
Full browser-based IDE running Node.js via WebAssembly. Open GitHub repos instantly, run npm packages without installation, share working demos with a URL. No local setup needed.