--- title: BIG LIST of WEB DESIGN TOOLS description: In Website Magazine's April 2014 issue, we featured 20-plus Web design tools, which can take a proje... image: https://www.websitemagazine.com/hubfs/Imported_Blog_Media/gradient-regular-logo-mark-Jan-23-2023-02-16-08-6449-PM-Apr-10-2023-02-05-43-2752-PM-Apr-25-2023-03-53-48-2858-AM-May-01-2023-10-30-25-2213-PM.png --- [Log In](https://www.websitemagazine.com/_hcms/mem/login) [Subscribe](https://websitemagazine.tradepub.com/free/w_webk05/prgm.cgi) [![Website Magazine Logo](https://www.websitemagazine.com/hs-fs/hubfs/gradient-regular@3x-1.png?width=586&height=145&name=gradient-regular@3x-1.png "Website Magazine Logo")](http://Website%20Services,%20Inc.) - [About](https://www.websitemagazine.com/about) - [FAQs](https://www.websitemagazine.com/about/faq) - [Advertise](https://www.websitemagazine.com/about/advertise) - [Editorial Staff](https://www.websitemagazine.com/about/editorial-publishing-staff) - [Resources](https://websitemagazine.tradepub.com) - [Newsletter](https://www.websitemagazine.com/newsletter-sign-up) - More - [Contact Us](https://www.websitemagazine.com/contact) [Log In](https://www.websitemagazine.com/_hcms/mem/login) [Subscribe](https://websitemagazine.tradepub.com/free/w_webk05/prgm.cgi) Search - [Latest](https://www.websitemagazine.com) - [Design](https://www.websitemagazine.com/web-design) - [Development](https://www.websitemagazine.com/web-development) - [SEO](https://www.websitemagazine.com/seo) - [Ecommerce](https://www.websitemagazine.com/ecommerce) - [Content](https://www.websitemagazine.com/content) - [Marketing](https://www.websitemagazine.com/marketing) - [Advertising](https://www.websitemagazine.com/advertising) - [Email](https://www.websitemagazine.com/email) - [Infographics](https://www.websitemagazine.com/infographics) - [View All Topics](https://www.websitemagazine.com/channels) # BIG LIST of WEB DESIGN TOOLS ![Peter Devereaux](https://www.websitemagazine.com/hubfs/Peter_Devereaux.png) [by Peter Devereaux](https://www.websitemagazine.com/web-design/author/peter-devereaux) 01 Apr, 2014 - - - [mailto:?Body=https://www.websitemagazine.com/web-design/big-list-of-web-design-tools](mailto:?Body=https://www.websitemagazine.com/web-design/big-list-of-web-design-tools) - Link Copied! ![BIG LIST of WEB DESIGN TOOLS](https://www.websitemagazine.com/hubfs/Imported_Blog_Media/gradient-regular-logo-mark-Jan-23-2023-02-16-08-6449-PM-Apr-10-2023-02-05-43-2752-PM-Apr-25-2023-03-53-48-2858-AM-May-01-2023-10-30-25-2213-PM.png) In Website Magazine's April 2014 issue, we featured 20-plus Web design tools, which can take a project to the next level. Here are those featured in the issue: **[Type Scale](https://www.type-scale.com)** is a visual calculator for creating typographical scales for Web designs. Just enter in the base size and what scale is needed, and it will provide optimal sizes for headers, body, and other text. **[Animatron](https://www.animatron.com)** is a simple tool for building HTML5 animations and interactive content. Work right in your browser and save projects in the cloud. **[The Ginger Project](https://www.getginger.co)** is a simple and effortless way to create an "explainer video" for anything you need to explain. You can include voice overs and it includes tools for creating a beautiful look to your projects. **[Duo](https://www.helloduo.com)** is a Web browser that lets you view both mobile and desktop versions of responsive websites you're designing. It's available as a bookmarklet, or as a standalone Mac program. **Adaptive Backgrounds** is a jQuery plugin for extracting colors from an image and applying those colors to the parent element. It's an easy way to make your background match your images. **[Layrs Control](https://madebyvadim.com/layrs/)** is a free Photoshop extension to improve your workflow. You can edit layer names, remove unused effects, delete empty layers, and more. **[Origami](https://facebook.github.io/origami/)** is a Quartz Composer toolkit for design prototyping. It makes it easy to create interactive prototypes, without the need for any programming. **[Social Kit](https://socialkit.madebysource.com/)** is a Photoshop plugin for creating cover images, profile pictures, ad banners and more for your favorite social platforms, including Facebook, Google, Twitter, and YouTube. **[Readymag](https://readymag.com/)** is a simple Web publishing tool for any kind of digital storytelling, from presentations to rich media magazines and microsites. It's cross-browser compatible and doesn't require any coding skills. **[Magnifier.js](https://mark-rolich.github.io/Magnifier.js/)** is a JavaScript library for creating a magnifying glass effect on your images. It includes zoom functionality using the mouse wheel, as well as the ability to display the magnified image within the lens or externally in a wrapper, among other features. **[Pinegrow](https://pinegrow.com/)** is an app for Windows and Mac that makes it fast and easy to mockup and design Web pages with (or without) Bootstrap, multi-page editing, and Less. **Feedthebot** offers up a complete guide to complying with Google's webmaster guidelines. There's a brief rundown of each topic on the homepage, linked to more in-depth coverage of each. **[The Titon Toolkit](https://titon.io/en/toolkit/)** is a collection of UI components for creating responsive, mobile, modern websites. It includes toosl for HTML5, CSS3, Sass, JavaScript, jQuery, and more. **[Min](https://minfwk.com/)** is a tiny CSS framework, weighing in at less than a single kilobyte. It includes all the basics you'll need for things like buttons and typography, and has support all the way back to IE5.5. **[The Pattern Library](https://thepatternlibrary.com/)** is a set of free patterns offered up for free by leading designers. You can use them freely in your designs, or even submit your own pattern to share. **[ScrollMagic](https://janpaepke.github.io/ScrollMagic/)** is a jQuery plugin for creating scroll interactions, including starting animations at a specific scroll position, synchronizing an animation to scrollbar movement, and more. **[Flaticon](https://www.flaticon.com/)** is a huge repository of downloadable free vector icons. They also offer a free plugin for using icons directly within Photoshop. **[Sitedrop](https://sitedrop.com/)** is an easy way for creatives to share their works-in-progress. Just connect to Dropbox to share any kind of file, which can then be downloaded, commented on, or favorited. **[Mozilla's Appmaker](https://appmaker.mozillalabs.com/)** is a drag-and-drop mobile app creator that works right in your browser. It's in pre-alpha release, so expect some bugs, but it looks promising. **[DiagnostiCSS](https://diagnosticss.github.io/)** makes it simple to detect inaccessible or invalid HTML markup, highlighting inline styles and event attributes, invalid links, empty and deprecated elements, and more. **[Raw](https://raw.densitydesign.org/)** is an open source Web app that lets you create vector-based visualizations in vector and raster formats to embed on your website. It's built on D3.js, and has a simple user interface. **[UsabilityHub](https://usabilityhub.com/)** is a set of usability tools that make it easier to test the effectiveness of your designs. Do five second tests, click tests, and more. ![Peter Devereaux](https://www.websitemagazine.com/hubfs/Peter_Devereaux.png) [Peter Devereaux](https://www.websitemagazine.com/web-design/author/peter-devereaux) As the Editor-in-Chief of Website Magazine and President of Website Services, Peter has established himself as a prominent figure in the digital marketing industry. With a wealth of experience and knowledge, Peter has been a driving force in shaping the landscape of digital marketing. His leadership in creating innovative and targeted marketing campaigns has helped numerous businesses achieve their revenue growth goals. Under his direction, Website Magazine has become a trusted source of information and insights for digital marketers worldwide. As President of Website Services, Peter oversees a team of talented professionals who specialize in SEO/SEM, email marketing, social media, and digital advertising. Through his hands-on approach, he ensures that his team delivers exceptional results to their clients. With a passion for digital marketing, Peter is committed to staying up-to-date with the latest industry trends and technologies, making him a sought-after thought leader in the field. - - - - - [mailto:peter.devereaux@websitemagazine.com](mailto:peter.devereaux@websitemagazine.com) #### Popular Post ### [6 Sexy Web Design Agency Websites ![6 Sexy Web Design Agency Websites](https://www.websitemagazine.com/hubfs/Imported_Blog_Media/gradient-regular-logo-mark-Jan-23-2023-02-19-54-9734-PM-Apr-10-2023-01-58-57-4342-PM-Apr-25-2023-03-47-11-5390-AM-May-01-2023-10-24-02-6643-PM.png)](https://www.websitemagazine.com/web-design/6-sexy-web-design-agency-websites) ### [Six User Testing Questions to Ask While Navigating Website Redesigns ![Six User Testing Questions to Ask While Navigating Website Redesigns](https://www.websitemagazine.com/hubfs/Imported_Blog_Media/question-mark483bf98ec5e163acbc5dff0000ff1aaa-3-1-1-1.png)](https://www.websitemagazine.com/web-design/six-user-testing-questions-to-ask-while-navigating-website-redesigns) ### [The Most Popular Fonts of 2015 ![The Most Popular Fonts of 2015](https://www.websitemagazine.com/hubfs/Imported_Blog_Media/serifshot-3-1-1-1.jpg)](https://www.websitemagazine.com/web-design/the-most-popular-fonts) #### Subscribe to Our Newsletter! [![](https://a.impactradius-go.com/display-ad/13053-1438301)](https://semrush.sjv.io/c/3976891/1438301/13053)![](https://imp.pxf.io/i/3976891/1438301/13053) #### Latest in Web Design [![The Vertical Split Screen Design Trend](https://www.websitemagazine.com/hubfs/Imported_Blog_Media/gradient-regular-logo-mark-Jan-23-2023-02-16-08-6449-PM-Apr-10-2023-02-12-54-4429-PM-Apr-25-2023-04-00-11-0245-AM-May-01-2023-10-36-44-2646-PM.png) The Vertical Split Screen Design Trend](https://www.websitemagazine.com/web-design/slicing-dicing-the-split-stacked-screens-trend) [![Six User Testing Questions to Ask While Navigating Website Redesigns](https://www.websitemagazine.com/hubfs/Imported_Blog_Media/question-mark483bf98ec5e163acbc5dff0000ff1aaa-3-1-1-1.png) Six User Testing Questions to Ask While Navigating Website Redesigns](https://www.websitemagazine.com/web-design/six-user-testing-questions-to-ask-while-navigating-website-redesigns) [![Design for Conversion: Apply the Von Restorff Effect](https://www.websitemagazine.com/hubfs/Imported_Blog_Media/unsplash-53117-Jan-23-2023-02-22-47-9807-PM-1-1-1.jpg) Design for Conversion: Apply the Von Restorff Effect](https://www.websitemagazine.com/web-design/design-for-conversion-apply-the-von-restorff-effect) [![Why Modern Web Design Is No More: The New Era of 'Product Design'](https://www.websitemagazine.com/hubfs/Imported_Blog_Media/gradient-regular-logo-mark-Jan-23-2023-02-24-25-7392-PM-Apr-10-2023-02-13-05-1129-PM-Apr-25-2023-04-00-33-0074-AM-May-01-2023-10-36-52-3196-PM.png) Why Modern Web Design Is No More: The New Era of 'Product Design'](https://www.websitemagazine.com/web-design/why-modern-web-design-is-no-more-the-new-era-of-product-design) [![Before and After: Transforming Email Design with the 3 P's](https://www.websitemagazine.com/hubfs/Imported_Blog_Media/gradient-regular-logo-mark-Jan-23-2023-02-16-08-6449-PM-Apr-10-2023-02-12-54-4429-PM-Apr-25-2023-04-00-11-0245-AM-May-01-2023-10-36-44-2646-PM.png) Before and After: Transforming Email Design with the 3 P's](https://www.websitemagazine.com/web-design/before-and-after-transforming-email-design-with-the-3-p-s) [![5 Fab, Fresh & Free Animation Libraries](https://www.websitemagazine.com/hubfs/Imported_Blog_Media/gradient-regular-logo-mark-Jan-23-2023-02-16-08-6449-PM-Apr-10-2023-02-12-54-4429-PM-Apr-25-2023-04-00-11-0245-AM-May-01-2023-10-36-44-2646-PM.png) 5 Fab, Fresh & Free Animation Libraries](https://www.websitemagazine.com/web-design/5-fab-fresh-free-animation-libraries) [![gradient-regular@3x](https://www.websitemagazine.com/hs-fs/hubfs/gradient-regular@3x.png?width=128&height=128&name=gradient-regular@3x.png)](https://www.websitemagazine.com/) 999 E Touhy Ave, Des Plaines, IL 60018   [info@websitemagazine.com](mailto:info@websitemagazine.com) [(888) 7WEBMAG](tel:18887932624) [(312) 313-6576](tel:13123136576) About - [Advertise](https://www.websitemagazine.com/about/advertise) - [Editorial](https://www.websitemagazine.com/about/editorial-publishing-staff) - [Contact Us](https://www.websitemagazine.com/contact) Resources Membership - Login - Subscribe Signup for our newsletter © 2026 Website Magazine. All Rights Reserved - [Privacy Policy](https://www.websitemagazine.com/about/privacy) ```json { "@context" : "https://schema.org", "@type" : "BlogPosting", "author" : { "@type" : "Person", "name" : "Peter Devereaux", "url" : "https://www.websitemagazine.com/web-design/author/peter-devereaux" }, "dateModified" : "2023-05-01T22:31:37.759Z", "datePublished" : "2014-04-01T05:00:00.000Z", "headline" : "BIG LIST of WEB DESIGN TOOLS", "image" : [ "https://www.websitemagazine.com/hubfs/Imported_Blog_Media/gradient-regular-logo-mark-Jan-23-2023-02-16-08-6449-PM-Apr-10-2023-02-05-43-2752-PM-Apr-25-2023-03-53-48-2858-AM-May-01-2023-10-30-25-2213-PM.png" ], "mainEntityOfPage" : { "@id" : "https://www.websitemagazine.com/web-design/big-list-of-web-design-tools", "@type" : "WebPage" }, "publisher" : { "@type" : "Organization", "logo" : { "@type" : "ImageObject", "url" : "https://www.websitemagazine.com/hubfs/gradient-regular@3x-1.png" }, "name" : "Website Services, Inc." } } ``` ```json { "@context" : "https://schema.org", "@type" : "NewsArticle", "author" : [ { "@type" : "Person", "name" : "Peter Devereaux" } ], "headline" : "BIG LIST of WEB DESIGN TOOLS", "publisher" : { "name" : "Website Magazine", "url" : "https://www.websitemagazine.com/" } } ```