Line Style Icon Design

icon design

Line style icons seem to be the trend that never gets old.

Part of the reason is that this icon style can work practically anywhere on any background type. Many of the popular, downloadable icon packs often include a line style design because of this versatility.

It’s easy to see this in the example above. Each icon is easy to see and understand at practically any size.

Simple Elements and Representations

icon design

As with most other design trends in 2018, simplicity is part of icon design as well. Simple shapes and geography combine to create almost over simplistic representations for icons.

The result is a quite an artful design that makes users look.

In the example using food icons above, each icon uses the common thread of a circle in the icon. This can be the overall shape of the icon itself or a part of the icon design. This shape connects each icon to one another in the project.

Icons with Gradients

icon design

The gradient color trend that has become one of the dominant themes of 2018 is a factor in icon design as well. From simple gradients in line strokes (such as the example above) to full gradient coloring to white icons on a gradient background, this color scheme is popular.

That might be what’s so appealing about the use of gradients in icons (and overall) – there are so many different ways to use the trend. You can add a gradient and still not have a project that looks just like something else.

Focus on Simple Coloring

icon design

Icon designers are taking the opposite approach with color as well and sticking to simple, more limited, more basic color palettes for these small design elements.

Using a limited palette is a great idea. With a design that’s so small, too much color or detail can overwhelm the space quickly and cause strain on the eye.

You don’t want users to have to think about what the icon is or what color means. Limiting the amount of detail – including elaborate coloring – can make each individual icon a little easier to see and understand. This is most important with icons that will be used at the smallest sizes.

Everything App Style

icon design

One of the reasons that icons have grown in popularity so much is that we are already designing them for almost everything. From app icons to app-style icons for favicons or desktop icons, this style is practically everywhere.

App-style icons have a distinct style almost of their own. This includes:

  • Square in shape
  • Rounded edges
  • Colored background (usually one color)
  • Simple shape inside icon
  • Plenty of contrast between icon and background color
  • No text or lettering

Thick, Uniform Strokes

icon design

Not only are line-style icons popular, but icons with thick line strokes are especially popular.

Designed often for single-color applications, these icons are frequently used in white or black on top of color or photo backgrounds.

Icons with thick, uniform strokes are most frequently used on their own, such as a cart icon or contact icon. They aren’t often used in a collection of icons.

Flat Icons Remain Popular

icon design

While much of the hard focus on flat design has evaporated, icon design is still pretty flat (or at least almost flat).

This is likely due to the super-simple nature of flat design and the idea that this look can integrate with a number of other styles fairly easily.

Even looking at some of the icon design examples and trends featured here, you’ll see that many of them are flat. (Line style icons are almost always flat, for example.)

Emoji Icons

icon design

Emojis have almost become their own language – a more visual form of communication that’s getting more generally accepted all the time.

Icons design is also taking on an emoji-esque flair. These icons are identifiable because of a focus on the head shape of a person or creature. (The Star Wars-inspired emoji icons above are a great example of how to have fun with icon design.)

This style of the icon could work great for a contact page or for representing people or personas in a design.

How to Design a Better Icon

Crafting a good icon or set of icons is more than just hopping on to some of the latest trends in icon design. Because of the small size of icons, attention to detail and precision are an important part of the design process.

Simple rules still hold true for icon design in 2018. Pair these guidelines with some of the trending ideas above to create something you’ll love:

  1. Start with a grid
  2. Build with geometry
  3. Create a unique shape
  4. Give icons plenty of room
  5. Stick to your brand colors
  6. Use consistent divots
  7. Design for the smallest size you need
  8. Don’t decorate

Icon Design Guidelines

icon design

A good way to keep up with what’s “in” is by looking at graphics standards and style guides. Each time Apple or Google changes their approach so does everyone else. Partially because they have to and partially because the new style is often reflective of the times and trends in icon design.

You can find guidelines here:

Conclusion

Icons are a useful design tool. From use as app icons to website marks or favicons to divots that can be used in a logo or throughout a design project, the icon is a mark that’s here to stay.

Approach icon design in the same way you would almost any other project, but really think about simplicity and size. Icons are made to look at quickly and are often small in size. This can have a great impact on the design.