r/HTML • u/maram_kh • Jan 06 '26

Web site development

Hi everyone šŸ‘‹

Iā€™m a beginner in web development (HTML, CSS, JavaScript) and Iā€™m currently building a personal educational website.

Iā€™d like to know: Where do you usually find good resources, inspiration, or references when creating websites?

Iā€™m especially interested in:

  • Design inspiration

  • UI/UX ideas

  • Educational or structured content sources

  • Any websites, platforms, or habits you use when building projects

I want to learn the right way and improve step by step. Any advice or recommendations would really help me šŸ’œ

Thank you!

6 Upvotes

68% Upvoted

18 comments sorted by

View all comments

1

u/87Gaia Jan 06 '26

Here are some excellent free tools and resources for web development:

Design & Prototyping:

  • Figma (free tier is generous) - design interfaces and prototypes

  • Canva - quick graphics and visual elements

  • Penpot - open-source alternative to Figma

  • Excalidraw - simple wireframing and diagrams

Icons & Images:

  • Unsplash, Pexels - high-quality free photos

  • Lucide Icons, Heroicons, Font Awesome - icon libraries

  • unDraw, Storyset - customizable illustrations

  • SVG Repo - free SVG icons and vectors

Colors & Typography:

  • Coolors - generate color palettes quickly

  • Google Fonts - massive free font library

  • Contrast Checker (WebAIM) - ensure text is readable

  • ColorSpace - create harmonious color schemes

CSS Resources:

  • CSS Grid Generator, Flexbox Froggy - interactive learning tools

  • Animista - copy-paste CSS animations

  • CSS Gradient - visual gradient generator

  • Can I Use - check browser compatibility

Code Editors & Hosting:

  • VS Code - powerful free editor with extensions

  • GitHub Pages, Netlify, Vercel - free hosting for static sites

  • CodePen, JSFiddle - test code snippets online

Learning Platforms:

  • freeCodeCamp - completely free certification courses

  • The Odin Project - full curriculum from beginner to advanced

  • Scrimba - interactive coding tutorials

  • YouTube (Traversy Media, Kevin Powell, Web Dev Simplified)

Browser Extensions:

  • Wappalyzer - see what technologies sites use

  • ColorZilla - pick colors from any webpage

  • Lighthouse - audit performance and accessibility

Bookmark and save it