Menu
Forums
All threads
Latest threads
New posts
Trending threads
New posts
Search forums
Trending
What's new
New posts
New profile posts
Latest activity
Members
Current visitors
New profile posts
Search profile posts
Upgrades
Log in
Register
What's new
Search
Search
Search titles only
By:
All threads
Latest threads
New posts
Trending threads
New posts
Search forums
Menu
Log in
Register
Navigation
Install the app
Install
More options
Contact us
Close Menu
Forums
Software Development
Programming
Website Design
Web Development Resource sheet
JavaScript is disabled. For a better experience, please enable JavaScript in your browser before proceeding.
You are using an out of date browser. It may not display this or other websites correctly.
You should upgrade or use an
alternative browser
.
Reply to thread
Message
<blockquote data-quote="Magic" data-source="post: 307145" data-attributes="member: 23359"><p><strong><u>Web Development Resource sheet composed by Gijs (<a href="http://www.gijsdb.com" target="_blank">www.gijsdb.com</a>)</u></strong></p><p><em>I don't own any of the following websites nor have I made them, this has been made to make your life a little easier when working on your next website.</em></p><p><em>I will edit this list overtime as I find more helpful things.</em></p><p><em>[Also found on my Ello along with another forum]</em></p><p><em></em></p><p>Suggest resources in the replies and I'll add them to the master.</p><p><strong>Images and color schemes</strong></p><p><a href="http://subtlepatterns.com/" target="_blank">http://subtlepatterns.com/</a> - A collection of tile-able background images</p><p><a href="http://www.iconarchive.com/" target="_blank">http://www.iconarchive.com/</a> - Huge collection of icons on all sorts of things.</p><p><a href="http://paletton.com/" target="_blank">http://paletton.com/</a> - Need a color scheme? Go here.</p><p><a href="http://www.color-hex.com/" target="_blank">http://www.color-hex.com/</a> - Looking for that hex code to a color? Look no further.</p><p><a href="http://favicon-generator.org/editor/" target="_blank">http://favicon-generator.org/editor/</a> - Favicon generator and gallery.</p><p><a href="http://www.ajaxload.info/" target="_blank">http://www.ajaxload.info/</a> - Need a fancy twirly loader thingy? Here it is.</p><p><a href="http://www.colourlovers.com/" target="_blank">http://www.colourlovers.com/</a> - Need inspiration for the color scheme of your next design? Check these suggestions out.</p><p><a href="http://bgpatterns.com/" target="_blank">http://bgpatterns.com/</a> - Need a tile-able background with custom colors? Look no further.</p><p><a href="http://alpha.wallhaven.cc/" target="_blank">http://alpha.wallhaven.cc/</a> - Actual pictures to use as backgrounds instead of patterns.</p><p><a href="https://icomoon.io/" target="_blank">https://icomoon.io/</a> - Custom icon pack, offers a free package. Pretty sure it's been shared before.</p><p><a href="http://icons8.com/" target="_blank">http://icons8.com</a> - Icon packs for Windows 8, IOS 7 and Android</p><p><a href="http://www.iconfinder.com/" target="_blank">http://www.iconfinder.com</a> - Here you can find any icons you want (free and premium)</p><p><a href="http://designmodo.github.io/Flat-UI" target="_blank">http://designmodo.github.io/Flat-UI</a> - Free User Interface Kit</p><p><a href="http://flatuicolors.com/" target="_blank">http://flatuicolors.com</a> - Flat UI Colors</p><p><a href="http://www.iconsdb.com/" target="_blank">http://www.iconsdb.com/</a> - More icons, woop woop!</p><p></p><p><strong>CSS</strong></p><p><a href="http://adam-marsden.co.uk/css-cheat-sheet/" target="_blank">http://adam-marsden.co.uk/css-cheat-sheet/</a> - CSS cheat sheet.</p><p><a href="http://ianlunn.github.io/Hover/#" target="_blank">http://ianlunn.github.io/Hover/#</a> - A collection of CSS hover effects.</p><p><a href="http://border-radius.com/" target="_blank">http://border-radius.com/</a> - Code generator for border trimming.</p><p><a href="https://www.google.com/fonts" target="_blank">https://www.google.com/fonts</a> - Huge collection of fonts, easily integrated.</p><p><a href="http://www.cssbuttongenerator.com/" target="_blank">http://www.cssbuttongenerator.com/</a> - Button generator.</p><p><a href="http://css3gen.com/box-shadow/" target="_blank">http://css3gen.com/box-shadow/</a> - Box shadow generator.</p><p><a href="http://cssmenumaker.com/" target="_blank">http://cssmenumaker.com/</a> - Need a menu? Just make one here.</p><p><a href="http://kenwheeler.github.io/slick/" target="_blank">http://kenwheeler.github.io/slick/</a> - The best carousel out there!</p><p><a href="http://www.csstyle.io/" target="_blank">http://www.csstyle.io/</a> "a modern approach for crafting beautifully maintainable stylesheets"</p><p><a href="https://gist.github.com/addyosmani/fd3999ea7fce242756b1" target="_blank">https://gist.github.com/addyosmani/fd3999ea7fce242756b1</a> - A CSS debugger, it'll outline each element with a different coloured box, simply run in your dev tools console</p><p><a href="http://elrumordelaluz.github.io/draGGradients/" target="_blank">http://elrumordelaluz.github.io/draGGradients/</a> - Generate custom CSS radial gradients, pretty sure it does a little more as well. Well worth a play!</p><p><a href="http://cssrefresh.frebsite.nl/" target="_blank">http://cssrefresh.frebsite.nl/</a> - Recently found this, increases productivity greatly! No need to refresh the browser to see CSS changes (only use for development, not on live sites as there is no need)</p><p></p><p><strong>Help</strong></p><p><a href="http://www.w3schools.com/" target="_blank">http://www.w3schools.com/</a> - Don't quite understand something? Check here!</p><p><a href="http://www.codecademy.com/" target="_blank">http://www.codecademy.com/</a> - Interactive lessons on a handful of languages including HTML, CSS, JavaScript, Python etc</p><p><a href="http://stackoverflow.com/" target="_blank">http://stackoverflow.com/</a> - Good place to ask your code related questions or need something fixed.</p><p><a href="http://v1.jontangerine.com/silo/css/pixels-to-ems/" target="_blank">http://v1.jontangerine.com/silo/css/pixels-to-ems/</a> - Need to convert those pixels to EM's for your responsive design? Here you go.</p><p><a href="https://dribbble.com/" target="_blank">https://dribbble.com</a> - Home to some of the best designers on the web. Great site for inspiration.</p><p><a href="http://phpacademy.org/" target="_blank">http://phpacademy.org</a> - Interactive lessons on a handful of languages including HTML, CSS, JavaScript, Python etc</p><p></p><p><strong>Hosting etc</strong></p><p><a href="http://www.dot.tk/en/index.html?lang=en" target="_blank">http://www.dot.tk/en/index.html?lang=en</a> - Free .tk domain, perfect for testing purposes.</p><p><a href="http://www.downforeveryoneorjustme.com/" target="_blank">http://www.downforeveryoneorjustme.com/</a> - Not sure wether your website is running? Check here.</p><p><a href="http://toolbar.netcraft.com/site_report?url=DOMAIN.COM" target="_blank">http://toolbar.netcraft.com/site_report?url=DOMAIN.COM</a> - Website report and information.</p><p><a href="http://quirktools.com/screenfly/" target="_blank">http://quirktools.com/screenfly/</a> - Responsive design testing on different screen sizes.</p><p><a href="http://www.000webhost.com/" target="_blank">http://www.000webhost.com/</a> - Perfect to go along with your free domain, a free host.</p><p><a href="http://fibrebox.pw/index.php" target="_blank">http://fibrebox.pw/index.php</a> - develop friendly hosting from $1</p><p><a href="https://www.dropbox.com/" target="_blank">https://www.dropbox.com/</a> - Appreciate this is a file sharing tool but if you're collaborating on a project (without a server) or working in multiple places, this is the way to go - simply share folders.</p><p></p><p><strong>Responsive</strong></p><p><a href="http://getbootstrap.com/" target="_blank">http://getbootstrap.com/</a> - CSS framework.</p><p><a href="http://www.responsivegridsystem.com/" target="_blank">http://www.responsivegridsystem.com/</a> - Simple grid system for responsive development.</p><p><a href="http://snipplr.com/view/17122/" target="_blank">http://snipplr.com/view/17122/</a> - HTML5 skeleton for a quick start.</p><p><a href="http://responsive.victorcoulon.fr/" target="_blank">http://responsive.victorcoulon.fr/</a> - Responsive testing for various screen sizes</p><p><a href="https://chrome.google.com/webstore/detail/window-resizer/kkelicaakdanhinjdeammmilcgefonfh?hl=en" target="_blank">Google Chrome Window Resizer</a> - This is a plugin, very similar to the above except with more choices imo. I use this when testing responsiveness on chrome.</p><p></p><p><a href="http://google.com/" target="_blank">http://google.com</a> - Can't quite find what you are looking for? JUST GOOGLE IT!</p><p></p><p><strong><u>List of contributors</u></strong></p><p>Magic, Sysode, IntactDev, Shado, Saintz</p></blockquote><p></p>
[QUOTE="Magic, post: 307145, member: 23359"] [B][U]Web Development Resource sheet composed by Gijs ([URL='http://www.gijsdb.com']www.gijsdb.com[/URL])[/U][/B] [I]I don't own any of the following websites nor have I made them, this has been made to make your life a little easier when working on your next website. I will edit this list overtime as I find more helpful things. [Also found on my Ello along with another forum] [/I] Suggest resources in the replies and I'll add them to the master. [B]Images and color schemes[/B] [URL]http://subtlepatterns.com/[/URL] - A collection of tile-able background images [URL]http://www.iconarchive.com/[/URL] - Huge collection of icons on all sorts of things. [URL]http://paletton.com/[/URL] - Need a color scheme? Go here. [URL]http://www.color-hex.com/[/URL] - Looking for that hex code to a color? Look no further. [URL]http://favicon-generator.org/editor/[/URL] - Favicon generator and gallery. [URL]http://www.ajaxload.info/[/URL] - Need a fancy twirly loader thingy? Here it is. [URL]http://www.colourlovers.com/[/URL] - Need inspiration for the color scheme of your next design? Check these suggestions out. [URL]http://bgpatterns.com/[/URL] - Need a tile-able background with custom colors? Look no further. [URL]http://alpha.wallhaven.cc/[/URL] - Actual pictures to use as backgrounds instead of patterns. [URL]https://icomoon.io/[/URL] - Custom icon pack, offers a free package. Pretty sure it's been shared before. [URL='http://icons8.com/']http://icons8.com[/URL] - Icon packs for Windows 8, IOS 7 and Android [URL='http://www.iconfinder.com/']http://www.iconfinder.com[/URL] - Here you can find any icons you want (free and premium) [URL]http://designmodo.github.io/Flat-UI[/URL] - Free User Interface Kit [URL='http://flatuicolors.com/']http://flatuicolors.com[/URL] - Flat UI Colors [URL]http://www.iconsdb.com/[/URL] - More icons, woop woop! [B]CSS[/B] [URL]http://adam-marsden.co.uk/css-cheat-sheet/[/URL] - CSS cheat sheet. [URL]http://ianlunn.github.io/Hover/#[/URL] - A collection of CSS hover effects. [URL]http://border-radius.com/[/URL] - Code generator for border trimming. [URL]https://www.google.com/fonts[/URL] - Huge collection of fonts, easily integrated. [URL]http://www.cssbuttongenerator.com/[/URL] - Button generator. [URL]http://css3gen.com/box-shadow/[/URL] - Box shadow generator. [URL]http://cssmenumaker.com/[/URL] - Need a menu? Just make one here. [URL]http://kenwheeler.github.io/slick/[/URL] - The best carousel out there! [URL]http://www.csstyle.io/[/URL] "a modern approach for crafting beautifully maintainable stylesheets" [URL]https://gist.github.com/addyosmani/fd3999ea7fce242756b1[/URL] - A CSS debugger, it'll outline each element with a different coloured box, simply run in your dev tools console [URL]http://elrumordelaluz.github.io/draGGradients/[/URL] - Generate custom CSS radial gradients, pretty sure it does a little more as well. Well worth a play! [URL]http://cssrefresh.frebsite.nl/[/URL] - Recently found this, increases productivity greatly! No need to refresh the browser to see CSS changes (only use for development, not on live sites as there is no need) [B]Help[/B] [URL]http://www.w3schools.com/[/URL] - Don't quite understand something? Check here! [URL]http://www.codecademy.com/[/URL] - Interactive lessons on a handful of languages including HTML, CSS, JavaScript, Python etc [URL]http://stackoverflow.com/[/URL] - Good place to ask your code related questions or need something fixed. [URL]http://v1.jontangerine.com/silo/css/pixels-to-ems/[/URL] - Need to convert those pixels to EM's for your responsive design? Here you go. [URL='https://dribbble.com/']https://dribbble.com[/URL] - Home to some of the best designers on the web. Great site for inspiration. [URL='http://phpacademy.org/']http://phpacademy.org[/URL] - Interactive lessons on a handful of languages including HTML, CSS, JavaScript, Python etc [B]Hosting etc[/B] [URL]http://www.dot.tk/en/index.html?lang=en[/URL] - Free .tk domain, perfect for testing purposes. [URL]http://www.downforeveryoneorjustme.com/[/URL] - Not sure wether your website is running? Check here. [URL]http://toolbar.netcraft.com/site_report?url=DOMAIN.COM[/URL] - Website report and information. [URL]http://quirktools.com/screenfly/[/URL] - Responsive design testing on different screen sizes. [URL]http://www.000webhost.com/[/URL] - Perfect to go along with your free domain, a free host. [URL]http://fibrebox.pw/index.php[/URL] - develop friendly hosting from $1 [URL]https://www.dropbox.com/[/URL] - Appreciate this is a file sharing tool but if you're collaborating on a project (without a server) or working in multiple places, this is the way to go - simply share folders. [B]Responsive[/B] [URL]http://getbootstrap.com/[/URL] - CSS framework. [URL]http://www.responsivegridsystem.com/[/URL] - Simple grid system for responsive development. [URL]http://snipplr.com/view/17122/[/URL] - HTML5 skeleton for a quick start. [URL]http://responsive.victorcoulon.fr/[/URL] - Responsive testing for various screen sizes [URL='https://chrome.google.com/webstore/detail/window-resizer/kkelicaakdanhinjdeammmilcgefonfh?hl=en']Google Chrome Window Resizer[/URL] - This is a plugin, very similar to the above except with more choices imo. I use this when testing responsiveness on chrome. [URL='http://google.com/']http://google.com[/URL] - Can't quite find what you are looking for? JUST GOOGLE IT! [B][U]List of contributors[/U][/B] Magic, Sysode, IntactDev, Shado, Saintz [/QUOTE]
Insert quotes…
Verification
Post reply
Forums
Software Development
Programming
Website Design
Web Development Resource sheet
Top