URLs

• CSS Battle -- take challenge to create CSS objects.

• Google HTML/CSS Style Guide

Tools for Web Dev

• appium — Automation for Apps (used to testing UX on different devices, more exact than Browser Inspector).

• Facebook Sharing Debugger tool — check if your urls display correctly or not on facebook.

• Fontello — make an icon as a font (there are also Awesomefont).

• BestFonts.pro — Free fonts for WEB and Photoshop (may be illegal).

• google-webfonts-helper — A Hassle-Free Way to Self-Host Google Fonts — giving us font files and font-face declarations based on the fonts, charsets, styles, and browser support you select.

• Happy Hues — Not sure what colors to use in your designs or where to use them? Happy Hues is a color palette inspiration site that acts as a real world example as to how the colors could be used in your design projects.

• HTML characters: copy & paste HTML characters.

• JavaScript Event KeyCodes — get the keycode of any key when you press.

• Regular Expression 101 — rules and transform directly.

• RequestBin — A modern request bin to collect, inspect and debug HTTP requests and webhooks.

• Responsively -- A modified web browser that helps in responsive web development. A web developer's must have dev-tool.

• Tiny helpers — A collection of free single-purpose online tools for web developers.

• Wayback mahine — an internet archive (to check old/dead websites).

• Webfont Generator

Frameworks

• For drawing / illustrating:
• Chart.js — Open source HTML5 Charts for your website.
• Excalidraw — Virtual whiteboard for sketching hand-drawn like diagrams.
• JSXGraph — JSXGraph is a cross-browser JavaScript library for interactive geometry, function plotting, charting, and data visualization in the web browser.
• Rough.js
• Three.js – JavaScript 3D library
• Two.js — a two-dimensional drawing api geared towards modern web browsers. It is renderer agnostic enabling the same api to draw in multiple contexts: svg, canvas, and webgl.
• Vector.js — Vector is an open source javascript library for creating interactive graphics.
• Zdog — Round, flat, designer-friendly pseudo-3D engine for canvas and SVG.

• For visualizing data:
• D3.js — a JavaScript library for manipulating documents based on data.
• idyll — A toolkit for creating data-driven stories and explorable explanations.
• Plotly — JavaScript Open Source Graphing Library

• Matter.js — a 2D physics engine for the web.

• Stage.js — 2D JavaScript library for cross-platform HTML5 game development.

• Text & Editor:
• markdown-it — Markdown parser, done right. 100% CommonMark support, extensions, syntax plugins & high speed
• Quill — Your powerful rich text editor.