📖 Guide

Chrome DevTools — Complete Reference

Essential Chrome DevTools shortcuts, Console API, debugging techniques, and workflows for web developers.

83 commands across 9 categories

Elements Panel Console Network Sources & Debugging Performance Application Keyboard Shortcuts Console API Common Workflows

Elements Panel

Command	Description
`Ctrl+Shift+C`	Toggle inspect element mode — click any element to select it
`F2 (on selected element)`	Edit selected element as HTML
`H`	Toggle visibility of selected element (adds visibility: hidden)
`Delete`	Delete the selected DOM node
`Ctrl+Z`	Undo DOM modification
`Right-click > Force state`	Force element pseudo-state (:hover, :active, :focus, :visited)
`Right-click > Break on`	Set DOM breakpoint for subtree modifications, attribute changes, or node removal
`Ctrl+F in Elements` e.g. Search: .my-class or //div[@id='app']	Search DOM by string, CSS selector, or XPath
`Computed tab`	View final computed CSS values and which rules contributed to each property
`Layout tab`	Visualize CSS Grid and Flexbox layouts with overlay badges

Console

Command	Description
`Ctrl+Shift+J`	Open DevTools directly to the Console panel
`$0`	Reference the currently selected element in the Elements panel
`$('selector')` e.g. $('.my-class')	Shorthand for document.querySelector()
`$$('selector')`	Shorthand for document.querySelectorAll(), returns a real array
`$_`	Reference the result of the last evaluated expression
`$x('xpath')` e.g. $x('//div[@class="test"]')	Evaluate an XPath expression against the document
`copy(object)`	Copy any object or value to clipboard as a string
`Ctrl+L`	Clear the console
`Right-click > Save as`	Save console output to a file
`Preserve log checkbox`	Keep console output across page navigations

Network

Command	Description
`Ctrl+Shift+J`	Open DevTools to Console panel
`Filter bar`	Filter by type: XHR, JS, CSS, Img, Media, Font, Doc, WS, Manifest, Other
`filter: keywords` e.g. -extension:.js or /api\/v[12]/	Text filter supports negation and regex
`Throttling dropdown`	Simulate network conditions: Slow 3G, Fast 3G, Offline, or custom profiles
`Disable cache checkbox`	Bypass browser cache while DevTools is open
`Right-click > Copy as cURL`	Copy any request as a cURL command for terminal replay
`Right-click > Copy as fetch`	Copy request as a JavaScript fetch() call
`Block request URL`	Right-click a request to block its domain or specific URL pattern
`Waterfall column`	Visualize request timing: DNS, TCP, TLS, TTFB, content download
`HAR export`	Export all network activity as a HAR file for sharing/analysis

Sources & Debugging

Command	Description
`Ctrl+P`	Quick-open any file by name (fuzzy search)
`Ctrl+Shift+P`	Open Command Menu for all DevTools actions
`F8`	Pause/Resume script execution
`F10`	Step over — execute current line and move to next
`F11`	Step into — enter the function call on current line
`Shift+F11`	Step out — run to end of current function and return to caller
`Ctrl+Shift+O`	Go to symbol/function in current file
`Conditional breakpoint` e.g. Break only when: user.id === 42	Right-click line number > Add conditional breakpoint
`Logpoint` e.g. Logpoint: 'user:', user.name	Right-click line number > Add logpoint — logs without pausing
`Ctrl+G`	Go to a specific line number in the current file

Performance

Command	Description
`Ctrl+E`	Start/stop performance recording
`CPU throttling`	Simulate slower CPU: 4x or 6x slowdown for mobile testing
`Screenshots checkbox`	Capture screenshots during recording to visualize rendering timeline
`Main thread flame chart`	Identify long tasks (>50ms) shown with red corner indicators
`Bottom-Up / Call Tree / Event Log`	Three views for analyzing where time is spent
`Web Vitals lane`	View LCP, FID, CLS markers directly on the timeline
`Layers panel`	Visualize compositing layers and identify unnecessary layer creation

Application

Command	Description
`Local Storage`	View, edit, and delete localStorage key-value pairs
`Session Storage`	View, edit, and delete sessionStorage key-value pairs
`Cookies`	Inspect, edit, and delete cookies per domain with all attributes
`IndexedDB`	Browse IndexedDB databases, object stores, and individual records
`Cache Storage`	Inspect Service Worker cache entries and their responses
`Service Workers`	View registered workers, force update, trigger push, or unregister
`Clear storage`	Selectively clear storage types and unregister service workers
`Manifest`	Inspect Web App Manifest for PWA install requirements

Keyboard Shortcuts

Command	Description
`F12 / Ctrl+Shift+I`	Toggle DevTools open/closed
`Ctrl+Shift+C`	Open DevTools in Inspect Element mode
`Ctrl+Shift+M`	Toggle device toolbar (responsive design mode)
`Ctrl+[ / Ctrl+]`	Switch between DevTools panels (left/right)
`Ctrl+Shift+D`	Toggle DevTools dock position (side/bottom/undocked)
`Esc`	Toggle the Console drawer in any panel
`Ctrl+Shift+P`	Command Menu — search all DevTools actions and settings
`Ctrl+F`	Search within the current panel (Elements, Sources, Network, etc.)

Console API

Command	Description
`console.log()` e.g. console.log('%cStyled', 'color: red; font-size: 20px')	Standard output — supports string substitution and CSS styling
`console.error()`	Output error message with stack trace and red styling
`console.warn()`	Output warning message with yellow styling
`console.table()` e.g. console.table([{name: 'Alice', age: 30}, {name: 'Bob', age: 25}])	Display array/object data as a sortable table
`console.group() / groupEnd()`	Create collapsible groups of log messages
`console.time() / timeEnd()` e.g. console.time('fetch'); await fetch(url); console.timeEnd('fetch')	Measure execution time between two points
`console.count()` e.g. console.count('render') // render: 1, render: 2, ...	Log the number of times this line/label has been called
`console.dir()`	Display an interactive list of object properties (useful for DOM elements)
`console.assert()` e.g. console.assert(x > 0, 'x must be positive')	Log an error only if the assertion is false
`console.trace()`	Output a stack trace from the current point

Common Workflows

Command	Description
`Emulate mobile`	Ctrl+Shift+M > select device > throttle CPU/network for realistic testing
`Debug event listeners`	Elements > Event Listeners tab > check 'Ancestors' to see all listeners
`Monitor function calls`	Console: monitor(fn) logs every call to that function with arguments
`Override files locally`	Sources > Overrides > Select folder > edit any file for local testing
`Screenshot node`	Right-click element > Capture node screenshot
`Full page screenshot`	Ctrl+Shift+P > 'Capture full size screenshot'
`Design mode`	Console: document.designMode = 'on' — makes entire page editable
`Replay XHR`	Network > right-click any XHR request > Replay XHR
`Snippets`	Sources > Snippets > create reusable JS scripts that persist across sessions
`Coverage`	Ctrl+Shift+P > 'Show Coverage' — find unused CSS and JS

More Guides

Complete Git command reference cheat sheet — from basics to advanced workflows, including branching, stashing, rebasing, and tagging. Searchable, with examples.

Complete Vim/Vi command reference cheat sheet — modes, motions, editing, search and replace, macros, registers, marks, and window management.

Docker Commands

Complete Docker & Docker Compose command reference cheat sheet — containers, images, volumes, networks, registry auth, buildx multi-platform builds, & cleanup.

Regex Reference

Complete regular expression reference cheat sheet — character classes, anchors, quantifiers, groups, lookaheads, flags, and JavaScript string methods.

Complete Linux/Bash command reference cheat sheet — file management, text processing, networking, system admin, and shell scripting.

Kubernetes Commands

Complete Kubernetes & kubectl command reference cheat sheet — pods, deployments, services, secrets, namespaces, scaling, RBAC, networking, and Helm charts.

Python Reference

Complete Python reference — syntax, data structures, string methods, control flow, classes, error handling, file I/O, comprehensions, and built-ins.

Complete SQL reference cheat sheet — queries, joins, aggregation, subqueries, indexes, window functions, string and date functions, and database management.

Nginx Reference

Complete Nginx configuration reference — server blocks, locations, proxying, SSL, load balancing, caching, security headers, and rate limiting.

Complete SSH reference — connections, key management, tunneling, config, SCP/SFTP, agent forwarding, security hardening, and troubleshooting.

Jenkins Reference

Complete Jenkins reference — pipeline syntax, Jenkinsfile, plugins, CLI, agents, shared libraries, credentials, and CI/CD patterns.

HTTP Headers Reference

Complete HTTP headers reference — request headers, response headers, caching, security, CORS, and content negotiation. Searchable, with examples.

PostgreSQL Reference

Comprehensive PostgreSQL reference — from connection basics to advanced features like JSONB, full-text search, window functions, and performance tuning.

Async Patterns Reference

Multi-language async/concurrency patterns — JavaScript, Python, Go, Rust, Java, plus retry, rate limiting, and circuit breaker patterns.

Protobuf & gRPC Reference

Comprehensive reference for Protocol Buffers (proto3) and gRPC — message definitions, services, streaming, and common patterns.

JS Array Methods

Complete JavaScript Array methods reference — creating, searching, transforming, sorting, iterating, and common patterns. Searchable, with examples.

Tailwind CSS Reference

Complete Tailwind CSS reference — layout, spacing, typography, colors, responsive design, states, and common patterns. Searchable, with examples.

GraphQL Reference

Complete GraphQL reference — schema definition, types, queries, mutations, directives, fragments, and common patterns. Searchable, with examples.

VS Code Shortcuts

Complete VS Code keyboard shortcuts cheat sheet — editing, navigation, search, multi-cursor, terminal, debug, and more. Searchable, with Cmd/Ctrl notation.

CSS Grid Reference

Complete CSS Grid reference — container properties, item placement, grid functions, and common layout patterns. Searchable, with examples.

CSS Flexbox Reference

Complete CSS Flexbox reference — container properties, item properties, and common layout patterns. Searchable, with examples.

React Hooks Reference

Complete React Hooks reference — useState, useEffect, useContext, custom hooks, and common patterns. Searchable, with examples.

TypeScript Reference

Complete TypeScript reference — types, interfaces, generics, utility types, and advanced patterns. Searchable, with examples.

AWS CLI Reference

Complete AWS CLI reference — EC2, S3, IAM, Lambda, ECS, RDS, CloudFormation, CloudWatch, SQS/SNS, Route 53, and common operations.

Complete Go (Golang) reference — syntax, types, structs, interfaces, goroutines, channels, error handling, testing, and the standard library.

PowerShell Reference

Complete PowerShell reference — cmdlets, pipelines, scripting, file operations, remote management, and Active Directory.

Complete Redis command reference — strings, hashes, lists, sets, sorted sets, pub/sub, transactions, and server management.

Terraform Commands

Complete Terraform reference — init, plan, apply, state management, modules, workspaces, providers, backend configuration, and HCL syntax.

Ansible Commands

Complete Ansible reference — playbooks, modules, inventory, roles, vault, Galaxy, handlers, conditionals, loops, and ad-hoc commands.

Complete Apache HTTP Server cheat sheet — virtual hosts, modules, rewrite rules, and SSL, plus access control, logging, and performance.

Complete ASCII character reference with decimal, hexadecimal, and character values, plus control codes and common escape sequences.

Powerful text processing language for pattern scanning, data extraction, arrays, control flow, and report generation with built-in variables.

Complete Bash reference cheat sheet — variables, strings, arrays, conditionals, loops, functions, file tests, I/O redirection, process management, and more.

Complete C programming cheat sheet covering syntax, pointers, memory management, structs, file I/O, preprocessor, and standard library.

Linux file permission commands and patterns for chmod, covering numeric and symbolic modes, recursive changes, and SUID/SGID/sticky bits.

Complete C++ cheat sheet covering STL containers, OOP, templates, smart pointers, iterators, lambda expressions, and modern C++ features.

Cron scheduling reference covering syntax, special strings, field values, crontab management, environment variables, and logging.

Complete CSS reference cheat sheet — selectors, box model, positioning, typography, animations, media queries, custom properties, and more.

Curl command-line reference for HTTP requests, headers, authentication, cookies, proxies, file transfers, SSL/TLS, debugging, and API patterns.

Dart language cheat sheet covering syntax, types, OOP, null safety, and async patterns, plus collections, error handling, and classes.

Docker Compose reference covering CLI commands, service configuration, networking, volumes, health checks, profiles, and build options.

Complete Drizzle ORM reference for schema definition, column types, queries, filters, joins, relations, migrations, indexes, and patterns.

Quick reference for Emmet abbreviations for lightning-fast HTML and CSS coding, covering nesting, multiplication, numbering, and grouping.

Search for files and directories in a directory hierarchy with powerful filtering by name, size, time, permissions, type, and actions.

Firebase reference covering Authentication, Firestore, Realtime Database, Cloud Functions, Hosting, Storage, and security rules.

Complete GitHub Actions cheat sheet — workflows, triggers, jobs, and CI/CD patterns, plus matrix strategies, caching, and artifacts.

Search text using patterns. Filter lines from files, command output, or streams with regular expressions, context options, and file filtering.

Complete HTML reference — document structure, text content, links, forms, tables, media, semantic elements, meta tags, attributes, and accessibility.

HTTP Status Codes

Complete reference of all standard HTTP response status codes across 1xx-5xx classes, with descriptions, examples, and common usage patterns.

Complete Java reference — data types, strings, collections, OOP, interfaces, exceptions, file I/O, streams, lambdas, and more.

Complete JavaScript reference — variables, types, operators, strings, arrays, objects, functions, async, DOM, ES6+, and more.

Quick reference for jQuery selectors, DOM manipulation, events, AJAX, and more, including animation effects, traversing, and plugins.

Laravel PHP framework cheat sheet for routing, Eloquent, Blade, Artisan, and more, plus middleware, validation, and authentication.

Quick reference for LaTeX document structure, math mode, formatting, and common packages, plus figures, tables, and citation styles.

Complete Markdown syntax reference for headings, formatting, links, tables, code blocks, task lists, footnotes, and extensions.

MongoDB reference covering CRUD operations, aggregation, indexes, and administration, plus replica sets, users, roles, and query operators.

Complete MySQL cheat sheet covering queries, joins, indexes, transactions, data types, user permissions, and database administration.

Next.js App Router reference covering routing, data fetching, server components, API routes, middleware, and deployment configuration.

Comprehensive Node.js runtime reference covering modules, file system, HTTP, streams, events, child processes, and npm scripts.

Complete npm cheat sheet — package management, scripts, publishing, and configuration, plus workspaces, security audits, and npx.

Essential NumPy commands for array manipulation and numerical computing in Python, covering reshaping, broadcasting, and linear algebra.

Pandas cheat sheet for data manipulation, analysis, and transformation in Python, covering DataFrames, grouping, merging, and date/time.

Complete PHP cheat sheet covering syntax, OOP, arrays, PDO, and modern PHP 8.x features, plus file I/O, superglobals, and error handling.

Production process manager for Node.js applications with cluster mode, monitoring, log management, startup scripts, and zero-downtime reloads.

Complete Prisma ORM cheat sheet — schema, queries, migrations, and CLI, plus relations, aggregations, filtering, and seeding patterns.

Comprehensive Rust language cheat sheet covering ownership, traits, pattern matching, structs, enums, error handling, closures, and concurrency.

Complete Sass/SCSS cheat sheet covering variables, mixins, functions, nesting, extends, maps, and the modern module system.

GNU Screen terminal multiplexer for persistent sessions, window and split-region management, key bindings, copy mode, and remote work.

Stream editor for filtering and transforming text, line by line — substitution, address ranges, hold space, branching, and flags.

Complete Supabase cheat sheet — auth, database, realtime, storage, and edge functions, plus row level security and migrations.

Terminal multiplexer cheat sheet for managing multiple sessions, windows, and panes from a single terminal, with copy mode and status bar configuration.

Quick reference for TOML configuration file syntax, types, tables, and common patterns, including arrays of tables and inline tables.

Complete Vercel CLI reference for deployment, project management, domains, environment variables, secrets, logs, edge functions, and configuration.

Next-generation frontend build tool with instant HMR, native ES modules, plugins, environment variables, library mode, and Rollup-based builds.

Module bundler for JavaScript applications — entry/output config, loaders, plugins, code splitting, module resolution, and optimization.

Quick reference for XPath expressions, axes, predicates, string functions, node tests, and operators for XML/HTML querying.

YAML syntax reference covering scalars, collections, anchors, aliases, multi-line strings, nested structures, and common patterns.

📖 Free, searchable command reference. Bookmark this page for quick access.