Collection of web design & dev links
Switch branches/tags
Nothing to show
Clone or download
noahbuscher Merge pull request #18 from shuwen/patch-1
Update Designer News link
Latest commit 53e6e09 Jan 9, 2018
Permalink
Failed to load latest commit information.
README.md Update Designer News link Jan 6, 2018

README.md

Inspire Awesome

Designing and building a modern frontend in any web project can be a long and arduous process. Here's a collction of links to help you. Enjoy!

Concept

These sites are good to get a general idea of possible layouts and style paths to take.
  • TheBestDesigns - General list of hand picked sites from across the web.
  • Awwwards - More awesome sites of various styles.
  • Dribbble - Snaps of icons, doodles, sites, and more from a talented group of people.
  • Siiimple - Another list of sites, but on the much simpler side.
  • Httpster - A curated list of the best sites around the Internet.
  • siteInspire - Get inspired.
  • Designer News - The best design / development links from the 'net.
  • CSS Winner - Reviewed list of great websites.
  • OnePageLove - Great influence for one page and general website design.
  • CodeMyUI - List of code snippets for fancy CSS/JS that make an awesome UI.
  • CodePen - Central repository of user submitted code concepts/snippets. Great for experiments.
  • CodyHouse - Tutorials and showcase of awesome UI elements.
  • CSS3 Cheat Sheet - CSS3 Cheat Sheet

Creation

These sites are good for building a basic framework for the site.
  • Color
    • Coolors - Super fast color scheme generator.
    • Kuler - Easily create or view a custom color swatch for your site.
    • uiGradients - Gorgous gradient generator.
    • Spectral - Minimal color swatch creation.
  • Unsemantic - Provides a good grid framework for small to large projects.
  • MDN - Documentation for HTML, CSS, JS, etc.
  • Bootstrap - Very popular framework for building modern websites and web apps.
    • Bootswatch - A list of free themes for Bootstrap.
  • Iconmonstr - A collection of free, simple icons.
  • Ionicons - Another great collection of free icons.
  • Subtle Patterns - A massive archive of free backgrounds for your projects.
  • Google Fonts - Tons of free, easy to use webfonts.
  • Text to ASCII - Add some sexy Easter eggs in your source code.
  • CSS3 Animation Cheat Sheet - A collection of CSS3 animation snippets.
  • Flat UI - A superb HTML and CSS framework for flat design. It's the juice.
  • CSS2Stylus - Convert your CSS to Stylus.
  • YMNNJQ - See jQuery functions in natural JS. No libraries.
  • User Inter Faces - Get ipsum images for user images.
  • Images
    • AllTheFreeStock - All the Free stock mmages, videos, sounds and icons in one location.
    • TheStocks.im - A collection of great stock photo websites.
    • Unsplash - Free, high quality stock photos.
    • Albumarium - A large collection of free stock photos.

Tools

Every painter needs a brush. Well... Most do.
  • Sublime Text - A very popular text editor for developers.
    • Themes
      • Flatron - It's flat, purple, and hella sexy.
      • Predawn - Gorgeous dark interface and syntax theme.
  • Atom - A hackable text editor for the 21st century.
  • Brackets - Modern, open source editor with live preview.
  • Hyper - Beautiful, extensible command-line interface
  • FileZilla - For those who fear FTP in the terminal.
  • WinSCP - Upload files to a MEAN stack or VPS server.
  • Sketch [OS X only] - A professional vector graphics app.

Collaborate

Working with a team? These links are for you.
  • Cloud9 - An awesome, zen way to work with others in the cloud.
  • Gist - Share code and text with others fast. Like a mini repository.
  • Scratchpad - A simple, RTC tool for coding and previewing websites.
  • Red Pen - Share your design and get feedback seamlessly.
  • Invoice Ninja - Open source invoicing platform.

Backends

Every awesome web app needs an awesome backend.
  • Firebase - A real-time front-end database for your sites.
  • DigitalOcean - A cheap and quality VPS hosting company.
  • Heroku - Cloud application platform; very easy to scale.
  • Auth0 - Authentication, done for you.

Testing

Before you launch, these are good tools to make sure your site is ready for stardom.
  • Placehold - Generate custom placeholder images of any size.
  • Browserling - Cross-browser test your website.
  • CodePen - A free web editor in your browser.
  • WooRank - A review tool for SEO elements, W3 validation, and numerous other variables. Free basic service.
  • Yslow - Tool for analyzing and finding fixes for multiple causes of slow site loading.
  • Hurl.it - Make HTTP requests in the browser.
  • Localtunnel - Open localhost ports to the world.
  • Postman - A tool to make HTTP requests, generate mock servers and make API documentation.

Good Reads

Need something to read in your spare time?
  • Smashing Magazine - A magazine for all things digital design.
  • CSS-Tricks - Awesome blog on anything and everything related to CSS.
  • Codrops - Great collection of design techniques for modern web developmers and designers.
  • Insert HTML - A blog covering current and upcoming techniques and technologies for web developers.
  • 1stWebDesign - A good, simple blog on web development and design.
  • A List Apart - Guest bloggers and full books on topics from coding to business practices.
  • GoodUI - It's definitely not bad.
  • Mentor - Get random advice from other designers and developers.

License

CC0

To the extent possible under law, Noah Buscher has waived all copyright and related or neighboring rights to this work.

❤️