You want to learn HTML & CSS but don& #39;t know where to get started?

https://abs.twimg.com/emoji/v2/... draggable="false" alt="🧵" title="Thread" aria-label="Emoji: Thread">
Choose a Code Editor:

https://abs.twimg.com/emoji/v2/... draggable="false" alt="💻" title="Computer" aria-label="Emoji: Computer"> Visual Studio Code [VS Code]
https://abs.twimg.com/emoji/v2/... draggable="false" alt="💻" title="Computer" aria-label="Emoji: Computer"> Sublime Text
https://abs.twimg.com/emoji/v2/... draggable="false" alt="💻" title="Computer" aria-label="Emoji: Computer"> Atom
https://abs.twimg.com/emoji/v2/... draggable="false" alt="💻" title="Computer" aria-label="Emoji: Computer"> Brackets
https://abs.twimg.com/emoji/v2/... draggable="false" alt="💻" title="Computer" aria-label="Emoji: Computer"> Vim
Learning Platforms:

https://abs.twimg.com/emoji/v2/... draggable="false" alt="📌" title="Reißzwecke" aria-label="Emoji: Reißzwecke"> http://freecodecamp.org"> http://freecodecamp.org 
https://abs.twimg.com/emoji/v2/... draggable="false" alt="📌" title="Reißzwecke" aria-label="Emoji: Reißzwecke"> http://sololearn.com"> http://sololearn.com 
https://abs.twimg.com/emoji/v2/... draggable="false" alt="📌" title="Reißzwecke" aria-label="Emoji: Reißzwecke"> http://developer.mozilla.org"> http://developer.mozilla.org 
https://abs.twimg.com/emoji/v2/... draggable="false" alt="📌" title="Reißzwecke" aria-label="Emoji: Reißzwecke"> http://w3schools.com"> http://w3schools.com 
https://abs.twimg.com/emoji/v2/... draggable="false" alt="📌" title="Reißzwecke" aria-label="Emoji: Reißzwecke"> http://hkhanacademy.org"> http://hkhanacademy.org 
https://abs.twimg.com/emoji/v2/... draggable="false" alt="📌" title="Reißzwecke" aria-label="Emoji: Reißzwecke"> http://codecademy.com"> http://codecademy.com 
https://abs.twimg.com/emoji/v2/... draggable="false" alt="📌" title="Reißzwecke" aria-label="Emoji: Reißzwecke"> http://frontendmentor.io"> http://frontendmentor.io 
Books:

https://abs.twimg.com/emoji/v2/... draggable="false" alt="📚" title="Bücher" aria-label="Emoji: Bücher"> HTML and CSS: Design and Build Websites, by Jon Duckett
https://abs.twimg.com/emoji/v2/... draggable="false" alt="📚" title="Bücher" aria-label="Emoji: Bücher"> Web designing books by Nick Pettit
https://abs.twimg.com/emoji/v2/... draggable="false" alt="📚" title="Bücher" aria-label="Emoji: Bücher"> The Essential Guide to CSS and HTML Web Design, by Craig Grannell
https://abs.twimg.com/emoji/v2/... draggable="false" alt="📚" title="Bücher" aria-label="Emoji: Bücher"> Smashing CSS, by Eric Meyer
https://abs.twimg.com/emoji/v2/... draggable="false" alt="📚" title="Bücher" aria-label="Emoji: Bücher"> HTML5 and CSS3 All-in-One Book For Dummies, by Andy Harris
YouTube Channels:

https://abs.twimg.com/emoji/v2/... draggable="false" alt="▶️" title="Nach rechts zeigendes Dreieck" aria-label="Emoji: Nach rechts zeigendes Dreieck"> Traversy Media
https://abs.twimg.com/emoji/v2/... draggable="false" alt="▶️" title="Nach rechts zeigendes Dreieck" aria-label="Emoji: Nach rechts zeigendes Dreieck"> freeCodeCamp
https://abs.twimg.com/emoji/v2/... draggable="false" alt="▶️" title="Nach rechts zeigendes Dreieck" aria-label="Emoji: Nach rechts zeigendes Dreieck"> DesignCourse
https://abs.twimg.com/emoji/v2/... draggable="false" alt="▶️" title="Nach rechts zeigendes Dreieck" aria-label="Emoji: Nach rechts zeigendes Dreieck"> The Net Ninja
https://abs.twimg.com/emoji/v2/... draggable="false" alt="▶️" title="Nach rechts zeigendes Dreieck" aria-label="Emoji: Nach rechts zeigendes Dreieck"> Dani Krossing
https://abs.twimg.com/emoji/v2/... draggable="false" alt="▶️" title="Nach rechts zeigendes Dreieck" aria-label="Emoji: Nach rechts zeigendes Dreieck"> Web Dev Simplified
https://abs.twimg.com/emoji/v2/... draggable="false" alt="▶️" title="Nach rechts zeigendes Dreieck" aria-label="Emoji: Nach rechts zeigendes Dreieck"> Florin Pop
Newsletters:

https://abs.twimg.com/emoji/v2/... draggable="false" alt="✉️" title="Briefumschlag" aria-label="Emoji: Briefumschlag"> Accessibility Weekly
https://abs.twimg.com/emoji/v2/... draggable="false" alt="✉️" title="Briefumschlag" aria-label="Emoji: Briefumschlag"> CSS Weekly
https://abs.twimg.com/emoji/v2/... draggable="false" alt="✉️" title="Briefumschlag" aria-label="Emoji: Briefumschlag"> Responsive Design Weekly
https://abs.twimg.com/emoji/v2/... draggable="false" alt="✉️" title="Briefumschlag" aria-label="Emoji: Briefumschlag"> Frontend Focus
Learn CSS by playing games:

https://abs.twimg.com/emoji/v2/... draggable="false" alt="🎮" title="Videospiel" aria-label="Emoji: Videospiel"> CSS Diner
https://abs.twimg.com/emoji/v2/... draggable="false" alt="🎮" title="Videospiel" aria-label="Emoji: Videospiel"> Flexbox Zombies
https://abs.twimg.com/emoji/v2/... draggable="false" alt="🎮" title="Videospiel" aria-label="Emoji: Videospiel"> Grid Garden
https://abs.twimg.com/emoji/v2/... draggable="false" alt="🎮" title="Videospiel" aria-label="Emoji: Videospiel"> Flexbox Defense
https://abs.twimg.com/emoji/v2/... draggable="false" alt="🎮" title="Videospiel" aria-label="Emoji: Videospiel"> Flexbox Froggy
https://abs.twimg.com/emoji/v2/... draggable="false" alt="🎮" title="Videospiel" aria-label="Emoji: Videospiel"> CSS Battle
Docs:

https://abs.twimg.com/emoji/v2/... draggable="false" alt="📜" title="Schriftrolle" aria-label="Emoji: Schriftrolle"> http://cssreference.io"> http://cssreference.io 
https://abs.twimg.com/emoji/v2/... draggable="false" alt="📜" title="Schriftrolle" aria-label="Emoji: Schriftrolle"> http://cssvalues.com"> http://cssvalues.com 
https://abs.twimg.com/emoji/v2/... draggable="false" alt="📜" title="Schriftrolle" aria-label="Emoji: Schriftrolle"> http://devdocs.io/css 
https://devdocs.io/css"... class="Emoji" style="height:16px;" src=" https://abs.twimg.com/emoji/v2/... draggable="false" alt="📜" title="Schriftrolle" aria-label="Emoji: Schriftrolle"> http://developer.mozilla.org/en-US/docs/Web/CSS
https://developer.mozilla.org/en-US/doc... class="Emoji" style="height:16px;" src=" https://abs.twimg.com/emoji/v2/... draggable="false" alt="📜" title="Schriftrolle" aria-label="Emoji: Schriftrolle"> http://w3schools.com/cssref 
https://w3schools.com/cssref&qu... class="Emoji" style="height:16px;" src=" https://abs.twimg.com/emoji/v2/... draggable="false" alt="📜" title="Schriftrolle" aria-label="Emoji: Schriftrolle"> http://w3.org"> http://w3.org 
Glossary:

https://abs.twimg.com/emoji/v2/... draggable="false" alt="📘" title="Blaues Buch" aria-label="Emoji: Blaues Buch"> http://codecademy.com/articles/glossary-html
https://codecademy.com/articles/... class="Emoji" style="height:16px;" src=" https://abs.twimg.com/emoji/v2/... draggable="false" alt="📘" title="Blaues Buch" aria-label="Emoji: Blaues Buch"> http://codecademy.com/articles/glossary-css">https://codecademy.com/articles/...
Free HTML/CSS templates:

https://abs.twimg.com/emoji/v2/... draggable="false" alt="🏗️" title="Gebäude im Bau" aria-label="Emoji: Gebäude im Bau"> http://inovatik.com"> http://inovatik.com 
https://abs.twimg.com/emoji/v2/... draggable="false" alt="🏗️" title="Gebäude im Bau" aria-label="Emoji: Gebäude im Bau"> http://templated.co"> http://templated.co 
https://abs.twimg.com/emoji/v2/... draggable="false" alt="🏗️" title="Gebäude im Bau" aria-label="Emoji: Gebäude im Bau"> http://tooplate.com"> http://tooplate.com 
https://abs.twimg.com/emoji/v2/... draggable="false" alt="🏗️" title="Gebäude im Bau" aria-label="Emoji: Gebäude im Bau"> http://html5up.net"> http://html5up.net 
https://abs.twimg.com/emoji/v2/... draggable="false" alt="🏗️" title="Gebäude im Bau" aria-label="Emoji: Gebäude im Bau"> http://mobirise.com"> http://mobirise.com 
https://abs.twimg.com/emoji/v2/... draggable="false" alt="🏗️" title="Gebäude im Bau" aria-label="Emoji: Gebäude im Bau"> http://templatemo.om"> http://templatemo.om 
https://abs.twimg.com/emoji/v2/... draggable="false" alt="🏗️" title="Gebäude im Bau" aria-label="Emoji: Gebäude im Bau"> http://uideck.com"> http://uideck.com 
https://abs.twimg.com/emoji/v2/... draggable="false" alt="🏗️" title="Gebäude im Bau" aria-label="Emoji: Gebäude im Bau"> http://freehtml5.co"> http://freehtml5.co 
Choose font for you project:

https://abs.twimg.com/emoji/v2/... draggable="false" alt="✍️" title="Schreibende Hand" aria-label="Emoji: Schreibende Hand"> http://fonts.google.com"> http://fonts.google.com 
https://abs.twimg.com/emoji/v2/... draggable="false" alt="✍️" title="Schreibende Hand" aria-label="Emoji: Schreibende Hand"> http://fontspace.com"> http://fontspace.com 
https://abs.twimg.com/emoji/v2/... draggable="false" alt="✍️" title="Schreibende Hand" aria-label="Emoji: Schreibende Hand"> http://1001fonts.com"> http://1001fonts.com 
https://abs.twimg.com/emoji/v2/... draggable="false" alt="✍️" title="Schreibende Hand" aria-label="Emoji: Schreibende Hand"> http://fontsquirrel.com"> http://fontsquirrel.com 
Done with learning? Deploy your projects:

* Netlify
* Firebase
* AWS
* Heroku
* Github Pages
* Vercel
* Surge
* Render
* Gitlab Pages
* Stormkit
* Azure
* Hostman
Done with projects? Make a CV:

https://abs.twimg.com/emoji/v2/... draggable="false" alt="📋" title="Klemmbrett" aria-label="Emoji: Klemmbrett"> http://resume.io"> http://resume.io 
https://abs.twimg.com/emoji/v2/... draggable="false" alt="📋" title="Klemmbrett" aria-label="Emoji: Klemmbrett"> http://visualcv.com"> http://visualcv.com 
https://abs.twimg.com/emoji/v2/... draggable="false" alt="📋" title="Klemmbrett" aria-label="Emoji: Klemmbrett"> http://resume.com"> http://resume.com 
https://abs.twimg.com/emoji/v2/... draggable="false" alt="📋" title="Klemmbrett" aria-label="Emoji: Klemmbrett"> http://novoresume.com"> http://novoresume.com 
https://abs.twimg.com/emoji/v2/... draggable="false" alt="📋" title="Klemmbrett" aria-label="Emoji: Klemmbrett"> http://wtfresume.com"> http://wtfresume.com 
https://abs.twimg.com/emoji/v2/... draggable="false" alt="📋" title="Klemmbrett" aria-label="Emoji: Klemmbrett"> http://resumake.io"> http://resumake.io 
https://abs.twimg.com/emoji/v2/... draggable="false" alt="📋" title="Klemmbrett" aria-label="Emoji: Klemmbrett"> http://flowcv.io"> http://flowcv.io 
Apply for jobs:

https://abs.twimg.com/emoji/v2/... draggable="false" alt="💼" title="Aktenkoffer" aria-label="Emoji: Aktenkoffer"> http://stackoverflow.com/jobs 
https://stackoverflow.com/jobs"... class="Emoji" style="height:16px;" src=" https://abs.twimg.com/emoji/v2/... draggable="false" alt="💼" title="Aktenkoffer" aria-label="Emoji: Aktenkoffer"> http://flexjobs.com"> http://flexjobs.com 
https://abs.twimg.com/emoji/v2/... draggable="false" alt="💼" title="Aktenkoffer" aria-label="Emoji: Aktenkoffer"> http://remote.co"> http://remote.co 
https://abs.twimg.com/emoji/v2/... draggable="false" alt="💼" title="Aktenkoffer" aria-label="Emoji: Aktenkoffer"> http://justremote.co"> http://justremote.co 
https://abs.twimg.com/emoji/v2/... draggable="false" alt="💼" title="Aktenkoffer" aria-label="Emoji: Aktenkoffer"> http://weworkremotely.com"> http://weworkremotely.com 
https://abs.twimg.com/emoji/v2/... draggable="false" alt="💼" title="Aktenkoffer" aria-label="Emoji: Aktenkoffer"> http://remoteok.io"> http://remoteok.io 
https://abs.twimg.com/emoji/v2/... draggable="false" alt="💼" title="Aktenkoffer" aria-label="Emoji: Aktenkoffer"> http://jobspresso.co"> http://jobspresso.co 
https://abs.twimg.com/emoji/v2/... draggable="false" alt="💼" title="Aktenkoffer" aria-label="Emoji: Aktenkoffer"> http://europeremotely.com"> http://europeremotely.com 
https://abs.twimg.com/emoji/v2/... draggable="false" alt="💼" title="Aktenkoffer" aria-label="Emoji: Aktenkoffer"> http://wfh.io"> http://wfh.io 
Good luck! https://abs.twimg.com/emoji/v2/... draggable="false" alt="❤️" title="Rotes Herz" aria-label="Emoji: Rotes Herz">
You can follow @denicmarko.
Tip: mention @twtextapp on a Twitter thread with the keyword “unroll” to get a link to it.

Latest Threads Unrolled: