Get illustrations Flagship Chapter 3 Hand Gestures and UI Icons

It's the third chapter of the Flagship series and keeps the look of the first two exactly. Every piece is a fully editable vector, delivered as SVG, PNG and layered AI files.

he style: one continuous line, one lime gradient

The hands are drawn as a continuous line. The outline runs around the fingers and, instead of stopping at a cuff, trails off the wrist into a small loop or curl, as if the pen never left the paper. There are no nails, no knuckles and no skin tone, just rounded fingers with a scallop or two to suggest the rest. That keeps the hands neutral enough to sit in any product.

Objects get a different line. Cups, cards, controllers and keys are outlined in a muted slate grey at one steady weight with rounded ends, while the hands, sparkles and motion marks are drawn in lime. The fill is a single lime gradient that fades to near white, and it sits slightly off the outline rather than tucked neatly inside it. That small offset is what makes the set feel drawn instead of traced.

Movement is shown with three or four short tick marks around a fingertip, or a looping squiggle. You won't find scenes, backgrounds or ground shadows here. The mood is light, friendly and a little playful, but it isn't a cartoon and it isn't corporate clip art.

What is inside the pack

All 75 illustrations sit on square artboards with transparent backgrounds, in three groups of 25:

• Everyday actions: pressing a button, clicking a mouse, typing, toggling a switch, entering a passcode, holding a phone or a card, dunking a tea bag, eating noodles with chopsticks

• Money, play and pets: a coin into a piggy bank, a treasure map, a game controller, a flashlight, a paper plane, balloons, a key, a barcode scanner, a rabbit in a magician's hat, a cat, a bird and a snake

• UI icons with no hands: eye, hidden eye, user, trash, home, cart, chat, bag, flame, bar chart, first aid kit, ticket, settings, plus, minus, mail, discount, bookmark, search, folder, compass, location, microphone, bell and calendar

Who it is for

Product designers get the most out of it. A fintech app can put the piggy bank on a savings goal screen and the hand holding a card on a payment confirmation. An onboarding flow can use the pointing finger for a tap prompt and the switch for a permissions step. A food delivery app already has the noodle bowl, the kettle and the takeaway cup.

Marketing teams can use the hand gesture illustrations in feature grids, where each card needs one clear action and nothing fighting the headline. Because the UI icons share the line and gradient, the pricing table on the same page can match.

Slide decks and help centre articles benefit too. A hand turning a key explains a security step faster than a sentence does.

How to use it

In Figma, drop the SVGs onto the canvas and every path stays editable, so swapping the lime for your brand colour takes a few clicks. You can also pull assets in through the GetIllustrations Figma plugin without leaving the file. For a quick colour change outside a design tool, the SVG colour editor works in the browser.

In React, Next.js or Webflow, inline the SVG when you want to animate it or tie the colour to a CSS variable, and use the PNG when a plain image tag is enough. Leave a little margin when you crop so the trailing wrist loops don't get clipped.

In Illustrator, open the layered AI file to adjust colours or combine two pieces in one layout.

Formats and technical detail

Each of the 75 illustrations comes in three formats:

• SVG, editable vector paths that scale to any size

• PNG with a transparent background

• AI source file with layers

Two colours carry the whole set, a slate line and a lime gradient, so a brand recolour means changing two values, not twenty.

Licence

The commercial licence covers websites, apps, client work, presentations, social posts, print and video, and you can recolour and resize the art as you like. You can't resell or redistribute the files on their own, include them in templates or themes for resale, use them as the main design on merchandise, or add them to AI training datasets. Attribution isn't required.

Pairs well with

Flagship Chapter 1 covers SaaS onboarding, empty states and error pages, and Flagship Chapter 2 covers medical, art, e-commerce and sales. Both use the same line and the same lime gradient, so a hand from this chapter can sit next to a character scene from either one without looking borrowed. For more sets built on colour fades, browse the gradient illustrations.