The HTML Cheatsheet is a free, open-source reference card from the iLoveCoding GitHub account that explains the core syntax of HTML elements — tags, attributes, and nesting — and offers downloadable PDF and image versions.
What is the HTML Cheatsheet?
The HTML Cheatsheet is a concise syntax guide for HTML, published as a README on GitHub by iLoveCoding. It takes the question "How do I write HTML?" and answers it with seven explicit rules for writing elements, each accompanied by a short code example. Its output is both a readable web page and a printable PDF (or GIF image) summary. The cheatsheet does not attempt to list every HTML element; it links to the Mozilla Developer Network HTML element reference for that purpose.
Key Features
- Seven syntax rules — Covers opening tags, closing tags, self-closing elements, attributes with values, and nested children, each with a code example in the README.
- Printable formats — Downloadable as a PDF or a GIF image so the rules can be studied offline or pinned on a wall.
- Visual diagram — An annotated image titled "HTML Cheatsheet" summarizes the syntax rules at a glance.
- MDN reference link — Points to the full Mozilla HTML element reference, which lists elements by category.
- Companion resources — Links to separate CSS and JavaScript cheatsheets from the same iLoveCoding GitHub account.
- Course recommendation — Promotes iLoveCoding's HTML & CSS video course for learners who want a full curriculum.
Who should use the HTML Cheatsheet?
- HTML beginners — People who have never written markup can learn the basic syntax rules in a single read.
- Students preparing for a web development exam — Use it as a quick refresher on tag terminology and element structure.
- Instructors — Can hand out the PDF or image version as a one-page reference in an intro web class.
- Developers coming from other markup languages — Use it to verify self-closing tag syntax or attribute formatting.
What can you do with the HTML Cheatsheet?
- Quick syntax lookup: Check any of the seven rules for writing an element, from opening tag to self-closing syntax.
- Print a reference card: Download the PDF or image and keep it at your desk for offline coding sessions.
- Find the full element list: Click through to the MDN HTML reference to browse every element by category.
- Continue learning: Open the linked CSS and JavaScript cheatsheets to cover the other two core web languages.
FAQ
Is the HTML Cheatsheet free?
Yes. The cheatsheet is published as an open-source GitHub repository and its contents, PDF, and image download are available without charge.
Does this cheatsheet cover every HTML element?
No. The page explicitly says it is not an exhaustive list and directs readers to the MDN HTML element reference for a complete list of elements by category.
Where can I find the CSS and JavaScript cheatsheets?
The README links to companion CSS and JavaScript cheatsheets from the same iLoveCoding GitHub account, so you can navigate between the three.
