Skip to main content

10 best new web design tools in July

If the existing tools for pattern libraries aren't quite right for you, this month there are two new ones that might be a better fit for your needs. Beyond that, there are tools for prototyping, sharing colours in Sketch, a CMS for Jekyll sites and much more – and we kick things off with a major new version release of Ruby on Rails.

01. Rails 5.0 (opens in new tab)

A major new release of Ruby on Rails

A major new release of Ruby on Rails

Rails 5.0 was released this month, bringing two particularly exciting  new features: Action Cable, a framework for handling WebSockets; and API  Mode, for when you need the backend to work with JSON. But that’s not  all! Head over here (opens in new tab) to read about the new goodies.

02. Algolia Places (opens in new tab)

Address autocomplete made easy

Address autocomplete made easy

Algolia Places uses OpenStreetMap's open source database to build an  excellent address autocomplete function that you can implement on your  website.

03. Drizzle (opens in new tab)

Pattern libraries with Drizzle

Pattern libraries with Drizzle

Drizzle is Cloud Four’s in-house tool for creating and presenting pattern libraries. In this blog post (opens in new tab) Tyler Sticka explains how the team started out using Fabricator and  Pattern Lab, but found neither catered to their particular needs – so  they built their own tool.

04. ProtoPie (opens in new tab)

Make interactive prototypes with ProtoPie

Make interactive prototypes with ProtoPie

This prototyping tool has some quite sophisticated features: you can  tweak and perfect the timing of animations; make use of the device’s  sensors such as sound, touch and tilt; and incorporate multi-finger  gestures.

05. Prism (opens in new tab)

Prism, a Sketch plugin for managing and sharing colour palettes

Prism, a Sketch plugin for managing and sharing colour palettes

This Sketch plugin creates an artboard colour palette with all the  colours in your document so you can share them easily. You can export as  code in many formats including CSS, SASS variables and Swift. Upcoming  features include gradients support and better template selection.

06. Astrum (opens in new tab)

Astrum - create a pattern library for any project

Astrum - create a pattern library for any project

Astrum is a lightweight pattern library created by No Divide. It's designed to be as versatile as possible so it can work with any web project, and can be themed to match your brand. It also comes with a command line tool for managing components.

07. Anime (opens in new tab)

Anime, a JavaScript animation library

Anime, a JavaScript animation library

Check out what you can do with this JavaScript animation library over on Julian Garnier's CodePen (opens in new tab).  It's flexible yet lightweight, works in all the major browsers, and you  can use it with CSS, Individual Transforms, SVG, DOM attributes and JS  Objects. Click the background of the Anime site for a cool easter egg.

08. Forestry (opens in new tab)

Forestry, a CMS for Jekyll and Hugo sites

Forestry, a CMS for Jekyll and Hugo sites

Looking for a CMS for your Jekyll or Hugo site? This is a good  option. To get started you import your project by connecting to a repo  or uploading a zip, then Forestry will automatically build a CMS. It  doesn't provide hosting, but will work with whatever you want to use.

09. Inker (opens in new tab)

Inker, a multi-platform vector art app that also works in your browser

Inker, a multi-platform vector art app that also works in your browser

This great vector art app works on your desktop, in your Chrome  browser and also on Android. It's good for sketching on a tablet because  it tidies up freehand drawings into smooth curves, which you can then  continue to tweak on your desktop computer.

10. Trym (opens in new tab)

Trym, a little app for SVG icons

Trym, a little app for SVG icons

Save yourself the bother of loading up a large app to work with SVG  icons by using Trym, a small app made just for this purpose. It enables  you to adjust file size and dimensions, and convert to PNG with a single  click.

Thank you for reading 5 articles this month* Join now for unlimited access

Enjoy your first month for just £1 / $1 / €1

*Read 5 free articles per month without a subscription

Join now for unlimited access

Try first month for just £1 / $1 / €1

Tanya is a writer covering art, design, and visual effects. She has 16 years of experience as a magazine journalist and has written for numerous publications including 3D World, 3D Artist, ImagineFX, Computer Arts, net magazine, and Creative Bloq. For Creative Bloq, she mostly writes about web design, including the hottest new tools, as well as 3D artwork and VFX.