50 Essential Cheatsheets, Guides & Docs for Web Designers

We have collected an avalanche of useful cheatsheets, references, guides, checklists and docs, covering almost all aspects of web design.

It doesn’t matter how many years of experience you have of a programming language, framework or CMS, you will always need to refer to the official documentation or, and more than likely, a handy quick reference cheatsheet, as it’s literally impossible to remember and know absolutely everything.

In this post I have collected an avalanche of useful cheatsheets, references, guides, checklists and docs, covering almost all aspects of web design, that will not only help to improve your productivity, but will also help to solve some of those frustrating programming issues that often arise (I’m looking at you PHP!).

Just click on the ‘view’ button beside each resource and either save the PDF or bookmark the page.

Cheatsheets for Web Designers

For speed and efficiency, I’ve categorized all of the cheatsheets and checklists for you. So just click on one of the links below and you will be taken directly to the relevant selection. Of course, if you want to just browse, just keep on scrolling down.

CSS HTML JavaScript PHP Markdown
WordPress Ghost Joomla ModX Concrete5
Drupal Browsers Git Sublime Text Newsletters
Social Media SEO Licenses Graphic Editors Checklists

Web Languages

CSS – Cascading Style Sheets

CSS Cheatsheet via Web View
CSS Vocabulary Web View
Media Queries Cheat Sheet Web View – Check Compatabilty of Default Local Fonts Web View

Popular CSS Frameworks

Master Cheatsheet for Bootstrap 3 PDF View
Complete Font Awesome Icon Reference Cheatsheet Web View
Bootstrap 3 Glyphicons Cheatsheet Web View
Foundation 5 Cheatsheet Web View

HTML – HyperText Markup Language

HTML Vocabulary Web View
HTML5 Tag Cheatsheet PDF View
HTML Elements Index Web View

JavaScript & jQuery

jQuery Quick API Reference Web Web View
Javascript Cheatsheet via Web Web View
JavaScript Regular Expression Cheatsheet Web View
Emmet Cheatsheet Web View


PHP Cheatsheet via Web View
PHP Date & Timestamp Converter Web View


Markdown Quick Reference Cheatsheet Web View
Printable Markdown Cheatsheet PDF View

CMS Cheatsheets


Official WordPress Code Reference Web View
WordPress Codex Web View
Copy/Paste WordPress Cheatsheet PDF Web View


Ghost Cheatsheet Web View
Ghost Developer Guides Web View


Joomla! Official Documentation Web View
Joomla! 3.x Templates Cheatsheet PDF View

MODx Revolution

MODx Revolution Documentation Web View
MODx Revolution's Cheatsheets PDF View


Concrete5 Official Docs Web View

Drupal 7

Drupal Community Docs Web View
Drupal 7 Database Cheatsheet PDF View
Drupal jQuery Cheatsheet PDF View
Drupal 7 Translation Cheatsheet PDF View

Browser Dev Tools

Chrome Devtools Cheatsheet Web View
Firebug Keyboard and Mouse Shortcuts Cheatsheet Web View

Git & GitHub

Git Cheatsheet via Git-Tower PDF View
Git Cheatsheet via GitHub Training PDF View
GitHub Visual Cheatsheet by Zack Rusin PNG View
A List of Cool Features of Git and GitHub Web View
Git Pretty Flowchart PDF View

Sublime Text

Commonly Used Sublime-Text Command Cheatsheet Web View
Sublime Text 3 OSX Cheatsheet Web View

Email & Newsletters

MailChimp Merge Tags Cheatsheet Web View
Campaign Monitor Template Cheatsheet PDF View

Social Media

Social Media Dimensions Cheatsheet PSD View
Social Media Cheatsheet PDF View


The Web Developer's SEO Cheatsheet via PDF View
On-Page SEO Cheatsheet Web View
Punctuation, Symbols & Operators in Search Web View

Software Licenses

TLDRLegal – Software Licenses Explained in Plain English Web View

Graphic Editors


Sketch 3 Visual Cheatsheet by Manuel Ebert PNG View
Keyboard Shortcuts for Sketch App Web View

Adobe Photoshop

Adobe Photoshop Keyboard Shortcuts (AZERTY) JPG View
Adobe Photoshop Keyboard Shortcuts (QWERTY) JPG View
Adobe Photoshop Reference Cheatsheet via Cheetyr Web View

Adobe Illustrator

Adobe Illustrator Keyboard Shortcuts (QWERTY) JPG View
Adobe Illustrator Keyboard Shortcuts (AZERTY) JPG View
Adobe Illustrator Reference/Cheatsheet via Cheetyr Web View

Handy Checklists

Web Developer Checklist Web View
Web Developer Checklist Chrome Extension CE View
Visual Web Design Checklist Web View
Launch Check List for Professional WordPress Websites Web View
Web Accessibility Checklist Web View
Usability Checklist Web View
IxD – Interaction Design Checklist Web View

Handy References

Can I use… Support tables for HTML5, CSS3, etc Web View – Quicklinks to Style Guides Web View

Have I Missed Any?

There are a multitude of cheatsheets and references out there, and I’m sure that I have missed a few, so if I have, please let me know in the comments below and I will add them to the post.