Dev Resources

This is a collection of some of my favourite web development resources that I use either in my standard workflow, or for experimenting with new technologies. The list is not exhaustive, but it is a good starting point for anyone looking to expand their toolkit.

Can I Use
Can I Use
web devbrowsers

Can I Use is a tool that provides up-to-date browser support tables for support of front-end web technologies on desktop and mobile web browsers.

View Can I Use
Codepen
Codepen
codesandbox

CodePen is a social development environment for front-end designers and developers. Build and deploy a website, show off your work, build test cases to learn and debug, and find inspiration.

View Codepen
Coolors
Coolors
coloursdesign

Coolors is a super fast colour scheme generator for designers and developers. Get your perfect palette at your fingertips.

View Coolors
CSS Stats
CSS Stats
cssanalytics

CSS Stats provides analytics and visualizations for your stylesheets. This information can be used to improve consistency in your design, track performance of your app, and diagnose complex areas before it snowballs out of control.

View CSS Stats
CSS Tricks
CSS Tricks
csstutorials

CSS-Tricks is a website about web design and development. It was created by Chris Coyier in 2007. It is a well-known site for web developers.

View CSS Tricks
Font Awesome
Font Awesome
typographyicons

Font Awesome is a font and icon toolkit based on CSS and LESS. It was made by Dave Gandy for use with Bootstrap, and later was incorporated into the BootstrapCDN.

View Font Awesome
GitHub
GitHub
codedev tools

GitHub is a web-based platform for version control using git. It is also where users can collaborate on or adopt open-source code projects, fork code, share ideas and more.

View GitHub
GitHub Profile Generator
GitHub Profile Generator
githubprofile

GitHub Profile Generator is a tool that generates a GitHub profile README file for your GitHub profile. It is a great way to showcase your skills and projects on your GitHub profile.

View GitHub Profile Generator
Google Analytics
Google Analytics
analytics

Google Analytics is a web analytics service offered by Google that tracks and reports website traffic, currently as a platform inside the Google Marketing Platform brand.

View Google Analytics
Google Fonts
Google Fonts
typography

Google Fonts is a library of free licensed font families, an interactive web directory for browsing the library, and APIs for conveniently using the fonts via CSS and Android.

View Google Fonts
Hero Patterns
Hero Patterns
patternsbackgrounds

Hero Patterns is a collection of repeatable SVG background patterns for you to use on your digital projects.

View Hero Patterns
HTML5 Doctor
HTML5 Doctor
htmldocs

HTML5 Doctor is helping you implement HTML5 today. This site is packed with articles, web development tips, and all the code you need to get started.

View HTML5 Doctor
Krystal UK
Krystal UK
hostingdomains

Krystal is a UK-based hosting company that offers a range of hosting services, including shared hosting, VPS hosting, and dedicated servers.

View Krystal UK
LinkedIn
LinkedIn
networkingsocialjobs

LinkedIn is a business and employment-oriented online service that operates via websites and mobile apps. It is mainly used for professional networking, including employers posting jobs and job seekers posting their CVs.

View LinkedIn
MDN Web Docs
MDN Web Docs
docsweb dev

MDN Web Docs is the ultimate resource for developers. It is a wiki that provides developers with information on how to use open web technologies including HTML, CSS, and JavaScript.

View MDN Web Docs
Next.js
Next.js
jsreact

Next.js is a React framework that enables functionality such as server-side rendering and generating static websites for React based web applications.

View Next.js
PageSpeed Insights
PageSpeed Insights
analytics

PageSpeed Insights is a tool that helps you identify ways to make your site faster and more mobile-friendly.

View PageSpeed Insights
Shade Studio
Shade Studio
tailwindcolours

Shade Studio is a tool that helps you generate colour palettes for your Tailwind CSS projects.

View Shade Studio
Shopify Cheat Sheets
Shopify Cheat Sheets
cheat sheetsshopify

Shopify Cheat Sheets is a collection of cheat sheets for Shopify developers. It includes a Liquid cheat sheet, a Shopify cheat sheet, and a Shopify theme cheat sheet.

View Shopify Cheat Sheets
SVG Repo
SVG Repo
iconssvg

SVG Repo is a great resource for free SVG icons. It has a large collection of icons that you can use in your projects.

View SVG Repo
Tailwind Color
Tailwind Color
colourstailwind

Tailwind Color is a tool that helps you generate colour palettes for your Tailwind CSS projects.

View Tailwind Color
Tailwind CSS
Tailwind CSS
css

Tailwind CSS is a utility-first CSS framework for rapidly building custom designs. It is a highly customizable, low-level CSS framework that gives you all of the building blocks you need to build bespoke designs without any annoying opinionated styles you have to fight to override.

View Tailwind CSS
Vector Logo Zone
Vector Logo Zone
logossvg

Vector Logo Zone is a site that provides high-quality vector logos in SVG format. It is a great resource for finding logos for your projects.

View Vector Logo Zone
W3 Schools
W3 Schools
docstutorials

W3Schools is a web developer information website, with tutorials and references relating to web development topics such as HTML, CSS, JavaScript, PHP, SQL, and JQuery.

View W3 Schools
WebAIM
WebAIM
accessibilityweb dev

WebAIM is a non-profit organization that provides web accessibility solutions. It is a great resource for learning about web accessibility and how to make your websites more accessible.

View WebAIM
YouTube
YouTube
socialtutorials

YouTube is a video-sharing platform that allows users to upload, view, rate, share, add to playlists, report, comment on videos, and subscribe to other users.

View YouTube

Tags