Web Design Tools and Resources
Web Design Tutorials
Web Design Inspiration
Moat – Search engine for banner ads
Web Design Icons
Web Design Blogs
Box Sizing Tutorial – How to add padding and a border to a block element and keep the same width
Placehold.it – Image placeholders that you can size by altering the URL
Lorempixel – Creative Commons dummy stock images that you can size by altering the URL
Unsplash Source – You can load random images and change the image dimensions by altering the URL.
CSS to SASS/SCSS Converter – Just paste your vanilla CSS code here and click a button to convert it.
Can I Use – Find out what browsers support the CSS you want to use, you can use names like blue, green red, etc. There’s 140 color names that you can use in your stylesheet.
Browser Supported Color Names – Instead of remembering the hex code
Skeleton – A lightweight grid framework.
Web Design Tools
Adobe Kuler – You can get some color scheme inspiration here or create your own color scheme.
COLOURlovers – Another place where you can get color scheme inspiration in addition to pattern inspiration.
Emmet – An awesome tool that will speed up the workflow for HTML coders.
QuirkTools Screenfly – Use this to check how responsive websites look on different devices.
Official jQuery Website – Download jQuery versions here.
W3Schools jQuery Selector Tester – Use this to see what elements are affected by each jQuery selector.
Why No Padlock? – If you’re not seeing the padlock in the URL box after you’ve converted your website to the https protocol, this website will let you know what’s causing the problem.
Bitbucket – A Git repository.
GitHub – A Git repository.
DeployHQ – Used to deploy changes to Git repositories to staging and/or production servers.