Photoshop (opens in new tab) is a powerful tool to have in the field of web design, especially if you have the right plugins to help you with your workflow. Here is a list of the best Photoshop plugins (opens in new tab) and tools for you to help you with creating websites.
After utilising just a few of these, you'll see just how different your Photoshop experience can be. No longer are you bound by the confines of a photo editor. These manipulations help save you time and open up font and colour possibilities that would have been hard to achieve otherwise. The sign of a pro is one who won't be controlled by the way a tool was intended to be used. Rather, they transform their tools to fit their needs. Here goes...
01. Renamy 4.0 (opens in new tab)
If you often need to rename a lot of layers this one will save you some time. Renamy lets you select multiple layers and rename the lot in one go - you can even find and replace for layer names. Nice.
02. CSS Hat 2 (opens in new tab)
CSS Hat accurately generates CSS code for the selected layer so you don't have to. It automatically measures layer sizes, detects font-family, font-weight, font-size etc, and there's a live preview so you can see immediately how the code's going to look in the browser.
- Brilliant Photoshop tutorials (opens in new tab)
03. GuideGuide (opens in new tab)
With GuideGuide you can create Photoshop guides for web in seconds. The plugin creates the guides from the selections that you make. You also have the option of choosing template guides for your layouts. This is a really helpful plugin that saves time.
04. Web Zap (opens in new tab)
Create website mock-ups in Photoshop super fast with this great plugin. Web Zap allows you to drag and drop website elements from and library of thousands of styles and components. It's great for building and editing fast mock-ups for clients, and costs $19 ($99 for team bundle of 10).
- Free Photoshop actions (opens in new tab)
05. SpecKing (opens in new tab)
A very essential tool to have in Photoshop, SpecKing quickly and easily creates specs of your design and annotates them. It is an important productivity tool to have as it creates measurements throughout your documents, and costs $19.
06. Subtle Patterns (opens in new tab)
Subtle Patterns is a great collection of beautifully applied textures and patterns, both sophisticated and contemporary. At the bottom of the page, creator Atle Mo gives you the option to download all of them as a .pat file to import right in to Photoshop. It's like he knew we'd be so lazy to have to import each one. Try using them subtly and in various combinations. I find it hard not to use them.
Contributions: Nick Hiley (opens in new tab) and Dan Rose (opens in new tab)
This is an updated and extended version of an article that previously appeared on Creative Bloq.
Related articles:
- Creating web icons that break the language barrier (opens in new tab)
- The 11 best iPad apps for pro designers (opens in new tab)
- How to make responsive web apps with container queries (opens in new tab)
