awesome-devtools
by moimikey
🤖 A curated list of in-browser bookmarklets, tools, and resources for modern full-stack software engineers.
AI summary
Dev Tool Collection
A curated collection of in-browser tools and resources for modern software development
- stars
- 450
- forks
- 38
- watching
- 25
- awesome lists
- 4
- entries
- 122
What's in the list
122 links in 30 sections, with live GitHub stats.activeno commit in 2y
Bookmarklets
- artoo.js
Client-side scraping utility for the currently loaded uri
- DOM Monster
A cross-platform, cross-browser bookmarklet that will analyze the DOM & other features of the page you're on
- Make Bookmarklets
Online tool to turn JavaScript into a bookmarklet
- Rulers Guides
A JavaScript library which enables Photoshop-like rulers and guides interface on a web page
- Viewport Resizer
A browser-based tool to test any website's responsiveness
Web-based Tools / Debug JavaScript
- Babel Time Travel
Travel in time as babel transpiles
- DebugJS
Debug your JavaScript in the browser (lol?)
- endpoints.dev
View realtime HTTP requests using a endpoints.dev generated URL
- httpbin
HTTP Request & Response service
- JavaScript Visualizer 9000
Loupe-inspired JavaScript execution visualizer
- JSONBIN.io
Custom, mock JSON API
- Loupe
Similar in goal to SlowmoJS, a JavaScript call stack visualizer
- SlowmoJS
Execute JavaScript in slow motion
Web-based Tools / Postman Alternatives
- Hoppscotch
A lightweight, web-based API development suite
- RecipeUI
Open source Postman alternative with type safety built in
- Reqbin
REST & SOAP API Online Testing Tool
Web-based Tools / Diagramming & Scratch
- asciiflow
ASCIIFlow is a client-side only web based application for drawing ASCII diagrams
- dbdiagram
Draw Entity-Relationship Diagrams, Painlessly
- dot-to-ascii
Graphviz to ASCII converter using Graph::Easy
- Excalidraw
Virtual whiteboard
- JSON-to-Chart
Create beautiful charts from JSON data in your browser
- JSONCrack
Visualize CSV/JSON/TOML/XML/YAML instantly into graphs
- Knotend
A flowchart editor designed for speed through keyboard shortcuts and autolayout
- Markmap
Visualize markdown as a feature-rich mindmaps
- nomnoml
A tool for drawing UML diagrams based on a simple syntax
- Sequence Diagram
An online tool / software for creating UML sequence diagrams
Web-based Tools / Diffing
- Diff Text
Quickly highlight differences in plain text, code, or JSON files
- JSONDiffPatch
Run a visual or non-visual diff on two JSON blobs
Web-based Tools / Document & Editors
- README.so
A simple editor to quickly add and customize all the sections you need for your project's readme
Web-based Tools / Generators
- JSONGenerator
Create random JSON data
- NGINXConfig
The easiest way to configure a performant, secure, and stable NGINX server
- Readme
All in one tool to quickly generate a readme for your project or github profile
- Mockium
Create test data
Web-based Tools / Image
- Clippy
CSS clip-path maker and editor
- Favic-o-matic
Literally generates every favicon neccessary + markup
- JPEG.rocks
Privacy-aware JPEG optimizer
- PicPerf
Boost web performance with image optimization. Analyze and improve tags, tags, and inline CSS
- PNG-to-SVG
Free conversion from JPG or PNG images To vectorized SVG
- Squoosh
Compress and optimize images in browser
- SVG-to-backgroundImage
Convert your SVG files into CSS url (data URIs) by encoding it
- SVGOMG
Try (SVG Optimizer) in the browser!
Web-based Services / Copy/Paste Scripts & Styles
- crontab guru
The quick and simple editor for cron schedule expressions by Cronitor
- CSS Scan - Box Shadows
CSS, Ready to use, click to copy
- CSS Scan - Buttons
CSS, Ready to use, click to copy
- CSS Scan - Checkboxes
CSS, Ready to use, click to copy
- CSS Scan - Shapes
CSS, Ready to use, click to copy
- Devtools Tips
Copy-and-paste'able collection of useful cross-browser DevTools snippets
- transition.css
Drop-in CSS transitions
Web-based Services / File Sharing
- file.io
Ephemeral file sharing. Convenient, anonymous and secure
- instant.io
Instant file transfer/sharing over WebTorrent
- pairdrop
Instant file transfer over your local network (P2P)
Web-based Services / Performance
- Perflink
JS benchmarks
Web-based Services / Playgrounds
- codepen
Social development environment for front-end designers and developers. Build and deploy a website, show off your work, build test cases to learn and debug, and find inspiration
- CodeSandbox
Online code editor and sandbox
- Ellie
The Elm Live Editor
- ES.nextBin
Like RequireBin but ES2015
- ESM
A fast, smart, & global CDN for modern(es2015+) web development
- JSBin
JS/Coffee/Babel/Babel/Live/JSX/HTML/Markdown/Pug/CSS/Stylus/LESS/Sass
- JSFiddle
JS/ES3/Coffee/HTML/CSS/Sass
- playcode.io
JS/Typescript/Coffee/LiveScript/Babel/CSS/Sass/LESS/Stylus/HTML/Pug
Web-based Services / Regex
- Debuggex
PCRE/Python/JavaScript regex matching
- ExtendsClass
PHP/Python/Ruby/JavaScript regex matching
- RegExplained
JavaScript regex matching
- Regexr
JavaScript regex matching
- Regulex
JavaScript Regular Expression Visualizer
Web-based Services / Transformation
- AST Explorer
Parse JS to an explorable AST tree via acorn, babel, babylon, espree, esprima, recast, shift, and typescript
- Babel REPL
The compiler for next generation JavaScript
- Compiler Explorer
Run compilers interactively from your web browser and interact with the assembly
- fixmyjs
Automatically fix your JS, driven by JSHint
- JavaScript Deobfuscator
A simple but powerful deobfuscator to remove common JavaScript obfuscation techniques
- JSNice
Statistical renaming, type inference and deobfuscation
- JSON ABC
Sorts JSON alphabetically
- Markdown to HTML
Paste or type your markdown and see it rendered as HTML. Download or copy the resulting HTML
- Markdown Tools
Tools to convert Markdown to/from a number of formats. E.g. Html to Markdown, or a CSV to a Markdown table
- Sucrase
Super-fast Babel alternative
- SWC
compile JS/TS files using modern JS features and outputs valid code that is supported by all major browsers
- Terser
JavaScript parser, mangler and compressor toolkit for ES6+
- Web2Img
A tool to bundle your web files into a single image, and extract them via Service Worker at runtime
- WebAssembly Explorer
translate C/C++ to WebAssembly, and then see the machine code generated by the browser
Web-based Services / Presentation
Resources / APIs
- FillText
Generate JSON datasets for testing or demonstration purposes
- JSONPlaceholder
Free fake API for testing and prototyping
- Zippopotamus
Zipcode to Geo
Resources / Browser Information
Resources / CDN
Resources / Cheat Sheets
- OWASP Cheat Sheet Series
A concise collection of high value information on specific application security topics
Resources / CSS Inliners
Resources / Documentation
- DevDocs
Basically but a web application and FREE
- ExplainShell
A better way to read MAN pages
Resources / Easings & Animations
Resources / Glyphs & Icons
- Copy/Paste Character
Copy & Paste emojis and unicode symbols
- CSS Icons
Copy & Paste icons in CSS + transition animations!
- Entity Lookup
Enter any character(s) and find its corresponding HTML entity code
- heroicons
Beautiful hand-crafted SVG icons, by the makers of Tailwind CSS
- Icon Finder
Millions of graphics for your design projects. Created by independent designers
- Icon Monstr
Discover 4000+ free icons in 300+ collections
- Icônes
Over 150,000 open source vector icons
- Tabler Icons
4000+ Open source free SVG icons. Highly customizable. No attribution required. For commercial use
Resources / Proxy as a Service
- CORS Anywhere
Proxies any HTTP request through a CORS enabled environment
Resources / Responsiveness
Resources / Validation & Parsers
- numverify
Validate phone numbers from over 200 countries
- CSP Evaluator
Evaluate CSP rules
- Ada URL Parser
WHATWG-compliant and fast URL parser written in modern C++, online
- Pythonium
Validate Python code
Security / SSL
- Self-Signed Certificate Generator
A self-signed certificate generator
- Mozilla SSL Configuration Generator
SSL configuration generator for various server software and platforms
Security / Test
- HSTS Preload
Check HSTS preload status and elibility
- Mozilla Observatory
A set of tools to analyze your website and inform you if you are utilizing the many available methods to secure it
- Security Headers by Probely
An easy to use tool designed to help you better deploy and understand modern security features that are available for your website
- Web Check
All-in-one OSINT tool for analysing any website
Notable Mentions
- ASCII Silhouettify
Convert images into ANSI-escaped color ASCII art
- Octopus
Lightning-fast visual sitemap builder & website planner
- Type Fluidity
Fluid typography value generator
- TypeScriptToLua
TypeScript to Lua
The Outside World / Swag
Nothing in this list matches your filter.
Featured in 4 awesome lists
Each link jumps to the spot where the list mentions awesome-devtools.