As a new front-end web developer you’ll find that there’s a lot to know! Below is a list of tools and resources that I frequent on a regular basis.
W3School HTML – comprehensive HTML reference guide.
Codrops CSS – comprehensive CSS reference guide.
SASS Cheat Cheet – comprehensive SASS reference guide.
Typography & Fonts
Ionicons – My favourite icon font. You’ll find everything you need here from special characters to social media logos.
Font Awesome – Scalable vector icons.
Google Fonts – A massive resource for fonts you can add to your project.
TypeWonder – test fonts on a live website.
CSS Tricks – HTML Entities and Special Characters – For when you forget that an Ampersand is &
Flat UI Colours – An easy-to-use resource for beautiful colour selections.
Simple Flat Colour Selector – Another easy-to-use colour reference.
Visual Studio – Free Download. Highly customizable code editor.
CodePen – Quickly test out your HTML and CSS live. No quickly test out some ideas or do some tests. No signup necessary. Get stared by Clicking Create → New Pen.
Animate CSS – For ready-to-go CSS Animations.
CSS3 Generator – Nice tool that’ll help with changing Border Radius, Box Shadow, Gradients, Outlines, Transitions and more.
Templated – A collection of simple CSS, HTML5 and Responsive site templates that are released free under Creative Commons. Great for inspiration or to kick start a project.