Interface Essential

Images Photography

Money Shopping

Business

Programming

Computer Devices

Artificial Intelligence

Phone

Mail

Shipping

Map Travel

Food Drink

Nature Ecology

Entertainment

Health

Culture

Work Education

Streamline 3.0

Ultimate

Core

Flex

Sharp

Plump

Micro

Freehand

Streamline Material

Nova

Cyber

Streamline Vault

Logos

Pixel

Google Material

Tabler

Remix

Feather

Iconoir

Carbon

Solar

Lucide

Brand Logos

Bootstrap

Atlas

Unicons

Ionic Icons

Phosphor

MingCute

Font Awesome

Majesticons

Mynaui

Radix

Heroicons

Flagpack

Outlined Line - Streamline Material Free

Arrow Insert

UI Actions

Rounded Line - Streamline Material Free

Sharp Fill - Streamline Material Free

Arrow Top Left Fill

Arrow Back 2

Ultimate Duotone - Free

Arrow Right

Arrows Diagrams

Sharp Line - Streamline Material Free

Flex Gradient - Free

Download Arrow

Guidance – Free

Up Arrow

Arrows

Core Flat - Free

Arrow Up 1

Ultimate Bold - Free

Core Flat

Triangle Arrow Left 1

Single Triangle Arrow

Core Duo

Line Arrow Left 1

Single Line Arrow

Core Solid

Rounded Line - Streamline Material

Big Arrow Right

Sharp Line - Streamline Material

Arrow Downward

Nova Line

Refresh Arrow 2

Synchronize

Outlined Line - Streamline Material

Line Start Arrow Notch

Text Formatting

Arrow Outward

Arrow Upward

Arrow Forward

Cyber Line

Arrow UP

Keyboard

Arrow Split

Outlined Fill - Streamline Material

Line Start Arrow Notch Fill

Ultimate Bold

Arrow Left 2

Freehand Duotone

Ultimate Colors

Arrow Left

Ultimate Regular

Arrow Right 2

Plump Duo

Arrow Vertical

Ultimate Duotone

Cyber Duotone

Arrow Down

Arrow Up

Arrow Back

Plump Pop

Platinum

Left Arrow

Basic Arrows

Arrow Down 2

Core Remix

Right Arrow

Arrow Next

Download Arrow 2

Upload Download

Plump Solid

Upload Arrow

Plump Flat

Synchronize Arrow

Arrow Up 2

<p>Micro is living proof that size matters. It was built using simplified shapes to ensure legibility at the smallest possible sizes.&nbsp;The Solid style is ideal for projects where quick recognition is crucial, especially effective on dark backgrounds. All Micro Solid icons are designed on a 10px grid using filled shapes.</p>

Micro Solid

<p>Built on a tiny 10px grid for maximum legibility. Ideal for navigation, buttons, and inline text icons in space-constrained designs.</p>

### **one sentence positioning**

Minimal shapes built for 10px — the only icon family designed specifically to behave like punctuation next to text.

---

### **what it signals**

Precision, restraint, UI density mastery, typographic integration.

---

### **best fit when**

- the UI is tight and text-heavy — tables, settings panels, inline actions, breadcrumbs
- icons must remain readable at 10–14px without any size increase
- icons need to coexist with text at cap-height without disrupting the reading line

---

### **avoid when**

- icons must carry brand personality or visual expressiveness
- large hero icons, empty states, or marketing visuals are needed
- primary navigation requires larger, more expressive metaphors

---

### **core visual rules**

- geometry: stripped to essential silhouette — only the minimum paths needed for recognition at 10px
- terminals: rounded — prevents sharp angle merging at high pixel density on small sizes
- corner language: minimal rounded logic for pixel clarity at minimum sizes
- curves: minimal — used only where essential for shape recognition, not for personality
- detail density: very low — zero decorative detail; visual skeleton only
- silhouette: essential, single-read — the scissors icon is blades-and-handles, not multi-segment precision
- emotional tension: very low — all design energy is directed at function, not expression

---

### **variants and hierarchy**

Micro Line

- Maximum subtlety; works inline with text, dense tables, compact toolbars; the default state

Micro Solid

- Stronger presence in the same footprint; selected and active states, tiny badges, status indicators

**line/solid pairing rule** Use Micro Line for default states and Micro Solid for selected and active — this is the preferred state pattern rather than increasing text weight or changing icon size. Both variants hold legibility in the same 10–16px range.

---

### **small-size behavior**

- recommended minimum size: 10px
- best range: 10–16px
- notes: Designed specifically to remain crisp where all other families fail — the 10px grid produces icons that hold their essential silhouette at the absolute minimum display size.

---

### **motion behavior**

- strengths: stable scaling at minimum sizes, crisp opacity transitions with no visual noise
- ideal motion contexts: subtle UI feedback in dense surfaces, micro-interactions in compact toolbars, low-noise state transitions (Line to Solid) in data tables

---

### **typography pairing**

UI-neutral workhorses

- Inter, Source Sans 3, IBM Plex Sans, Roboto, SF Pro Text, Segoe UI

Humanist clarity (warmer tone)

- Avenir Next, Calibre, Public Sans, Work Sans, Frutiger

Neo-grotesque systems (technical tone)

- Helvetica Now Text, Neue Haas Grotesk Text, Graphik, Aktiv Grotesk, Univers

**type alignment rule** Keep icon size close to the cap height of adjacent text. Avoid heavy type weights near Micro Line — the weight imbalance makes labels dominate and icons disappear. Use Micro Solid for selection emphasis rather than switching to bold text, which preserves visual balance.

**typefaces to avoid** Display fonts at any weight, hand-drawn or script fonts, highly decorative typefaces — the functional register of Micro requires type that shares its invisible-infrastructure philosophy.

---

### **mixing guidance**

Recommended with

- Core — Micro handles the density layer while Core manages primary navigation
- Ultimate — same pattern; Micro for inline and table contexts, Ultimate for product chrome
- Sharp — Micro as the density specialist, Sharp as the primary technical UI system

Possible with normalization

- Nova — compatible neutral construction; normalize by keeping Micro strictly below 16px
- Flex — Flex carries the personality layer while Micro handles the density layer

Avoid mixing with

- Plump — the 48px construction is the opposite end of the scale spectrum from Micro's 10px grid
- Kameleon — flat illustration containers are a categorically different register
- Stickies — display-size sticker aesthetic is incompatible with Micro's typographic density role

**normalization rules when mixing**

- use Micro as a density layer only — tables, inline actions, compact chips — while another family handles navigation and primary UI
- avoid mixing Micro with high-detail families in the same component
- maintain consistent optical weight alongside text — Micro Line near regular body text, Micro Solid near medium or semibold labels

---

### **primary use cases**

- inline text actions (edit, delete, share, open links)
- dense side panels, settings pages, and configuration forms
- data tables, column headers, and row-level actions
- tags, chips, filters, and compact input fields
- micro tooltips, breadcrumbs, and status indicators
- compact density modes in large enterprise design systems

---

### **secondary use cases**

- subtle UI animation in tight layout contexts
- system tray and OS-adjacent UI chrome

Designed for interfaces

Arrows Corner Down Left

Arrows Corner Down Left icon - Micro Solid Set

Download Arrows Corner Down Left SVG vector or transparent PNG icon in Solid, Minimal, Bold, Geometric, Glyph, Wireframe style(s) for Sketch and Figma. It belongs to Micro Solid vectors SVG collection.