Skip to the content
FilCommunityWorkflowsDocsOpen Fil
The icon sheet from the skill: every icon in Icons.md, soft rounded 2 px line icons in ink black with generous corner radii…

Image · Nano Banana 2.1

The icon sheet from the skill: every icon in Icons.md

The icon sheet from the skill: every icon in Icons.md, soft rounded 2 px line icons in ink black with generous corner radii and round caps, each with one small mint detail such as a coin or a dot, on a plain off-white background. Reference (Icons.md): # Icons - **For:** A budgeting app's tab bar, settings and main screens, friendly and approachable like a modern banking app - **Style:** Soft rounded line icons, 2 px stroke at 24 px, round caps and joins, generous corner radii, flat and front-on - **Colours:** Ink black (#1B1F23) lines with one small mint (#3EC9A7) detail on each icon, such as a coin or a dot, used the same way across the set - **Icons:** Wallet, savings, bills, cards, goals, budget, income, spending, reports, alerts, settings, profile Reference (icon-set SKILL.md): --- name: icon-set description: Draws a consistent set of icons, one stroke, one grid and one style of metaphor, as a sheet to review and as clean SVG ready for code. Use for UI icon sets, app and feature icons, and pictograms. --- # Icon set ## Read first Icons.md for the product, the style, the colours and the icons by name, in order; any style reference wired in. ## One system for every icon - Each icon drawn on a 24 × 24 grid with 2 px of padding, at the same optical size, so a circle, a square and a tall shape look equally big. - One stroke weight (Icons.md's, 1.5 or 2 px at 24 px) with the same caps and joins, the same corner radius and the same amount of detail in every icon. - One point of view: all flat and front-on, unless Icons.md asks for another. - Simple, familiar metaphors, one idea per icon, recognisable at 16 px, with no words or letters inside. - Colour as Icons.md says: one colour, or a duotone with the accent on one part of each icon, used the same way across the set. ## Sheet (4:3) The icons in Icons.md's order on a clean grid (four across, three down for twelve), each centred in an equal cell on a plain background, large enough to judge, with its name in small type under it. ## SVG icons - One SVG that shows the whole set as the sheet does: each icon a 24 × 24 <symbol> with an id from its name (icon-wallet), placed with <use> in its cell and labelled under it, so the file previews as the sheet and each icon can be copied out. - Drawn with paths, lines, rects and circles: stroke="currentColor" at the set's width, round caps and joins, fill="none" except where a part is meant to be solid, on whole or half pixels so lines stay crisp. - The wired sheet's metaphors and shapes, redrawn cleanly. ## Avoid Mixed stroke weights or angles, detail that disappears at 16 px, clip-art, gradients and shadows, letters standing in for pictures, and icons of different sizes.

Meng To@shadownessguy0097
Model
Nano Banana 2.1
Made by
Meng To
Shared
Likes
0
Open in Fil

Use its prompt, turn it into a video or a 3D model, or find more like it in Fil. Fil is invite-only for now: without an invitation, Open in Fil shows the waitlist.

More like this

The SVG icons from the skill: the wired icon sheet redrawn as clean vector icons, with the names from Icons.md. Reference…The SVG icons from the skill: the wired icon sheet redrawn as clean vector icons, with the names from Icons.md. Reference (Icons.md): #…Direction: Geometric mark. Build the mark from one simple solid, a ring, drawn so it hints at a shallow salt pan filling…Direction: Geometric mark. Build the mark from one simple solid, a ring, drawn so it hints at a shallow salt pan filling with seawater and…Direction: Wordmark. The name tidewell set in a custom lowercase wordmark with one distinctive detail, such as a joined…Direction: Wordmark. The name tidewell set in a custom lowercase wordmark with one distinctive detail, such as a joined letter pair in the…Direction: Symbol. An abstract symbol drawn from a single salt crystal and the rising and falling tide, simple enough to…Direction: Symbol. An abstract symbol drawn from a single salt crystal and the rising and falling tide, simple enough to read at 16 px…Editorial black-and-white halftone line illustration about designing, developing and making apps. A tall, rubbery…Editorial black-and-white halftone line illustration about designing, developing and making apps. A tall, rubbery long-limbed character in…A one-page brand board for the brand in the brief, built around the single strongest mark across the wired sheets, laid out…A one-page brand board for the brand in the brief, built around the single strongest mark across the wired sheets, laid out as the skill’s…An editorial spot illustration of a long-limbed designer sitting cross-legged on a chair at a laptop, one hand resting on…An editorial spot illustration of a long-limbed designer sitting cross-legged on a chair at a laptop, one hand resting on their chin and…A true-isometric diorama illustration on one rounded off-white slab with a faceted bevelled edge, showing an online…A true-isometric diorama illustration on one rounded off-white slab with a faceted bevelled edge, showing an online business workspace: a…Editorial black-and-white halftone line illustration about designing, developing and making apps. A tall, rubbery…Editorial black-and-white halftone line illustration about designing, developing and making apps. A tall, rubbery long-limbed character in…An editorial spot illustration of a long-limbed designer sitting cross-legged on a chair at a laptop, one hand resting on…An editorial spot illustration of a long-limbed designer sitting cross-legged on a chair at a laptop, one hand resting on their chin and…Editorial black-and-white halftone line illustration about designing, developing and making apps. A tall, rubbery…Editorial black-and-white halftone line illustration about designing, developing and making apps. A tall, rubbery long-limbed character in…Editorial black-and-white halftone line illustration about designing, developing and making apps. A tall, rubbery…Editorial black-and-white halftone line illustration about designing, developing and making apps. A tall, rubbery long-limbed character in…