Specializing in Inspire
Designing and constructing a modern front-end in any web project can be a long and difficult process. Here’s a collection of links to help you….
Concept Inspire
These sites are good to get a general idea of possible layouts and style paths to take.
- Awwwards – More splendid sites of various styles.
- Dribbble – Snaps of icons, doodles, sites, and more from a talented group of people.
- Httpster – A curated list of the best sites around the Internet.
- siteInspire – Get inspired.
- MinimalSites – Another list of sites, but on the much simpler side.
- Designer News – The best design / development links from the ‘net.
- CSS Winner – Reviewed list of great websites.
- TheBestDesigns – General list of hand picked sites from across the web.
- 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
- ColorPicker – Simple yet affective. The name says it all.
- Kuler – Easily create or view a custom color swatch for your site.
- 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 web fonts.
- 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.
- Themes
- Atom – A hackable text editor for the 21st century.
- 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.IO – 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.
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 Chrome extension to make HTTP requests.
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.