Tutorials

Learn to master Axialis IconVectors through these step-by-step, developer-centric tutorials. Each guide walks you through essential features, from basic icon creation to advanced export workflows.

Complete Windows App Icon Set

By Axialis Team

Export a full Windows icon pack from one SVG—ICO (16–256) plus WinUI/UWP Visual Assets PNGs with scale qualifiers—and wire them into Package.appxmanifest – Read More →

Build an SVG Sprite for Vite/React/Vue

By Axialis Team

Generate a symbol sprite via a Vite plugin or the svg-sprite CLI, then reference icons with <use>. Production‑ready caching notes included – Read More →

Keep SVG Stroke Width Constant

By Axialis Team

Lock stroke width with vector-effect="non-scaling-stroke" and learn when to outline strokes in IconVectors for tiny sizes – Read More →

Accessible SVG Icons

By Axialis Team

Decorative vs informative, aria-hidden vs role="img" + labels, and keyboard focus rules—ready to copy patterns – Read More →

Vue 3 (Vite) — Inline SVGs as Components

By Axialis Team

Install vite-svg-loader, import ./icon.svg as a Vue component, and theme via currentColor – Read More →

React (Vite/Next) — Import Themable SVG Icons

By Axialis Team

Install SVGR, import ./icon.svg as a React component, and theme via currentColor. Works with Vite and Next.js – Read More →

Android: Convert SVG to VectorDrawable

By Axialis Team

Export a clean SVG in IconVectors and import it with Vector Asset Studio to generate VectorDrawables, with optional PNG fallbacks – Read More →

Electron/Desktop App Icons from One SVG (ICO + ICNS + PNG set)

By Axialis Team

Export ICO, ICNS, and PNG icon packs from one SVG in IconVectors, then plug paths into your electron‑builder config – Read More →

Use SVG Icons in wxWidgets C++ Applications

By Axialis Team

Load SVG from a string or file with wxBitmapBundle::FromSVG/FromSVGFile, convert to wxBitmap, and draw—starting from IconVectors SVGs – Read More →

Use SVG Icons in C++ Applications with NanoSVG

By Axialis Team

Import and render SVGs with NanoSVG: Windows HBITMAP, cross‑platform PNG export, and wxWidgets display — starting from IconVectors SVGs – Read More →

Use SVG Icons in C++ Applications with LunaSVG

By Axialis Team

Import and render SVGs with LunaSVG: Windows HBITMAP, cross‑platform PNG export, and wxWidgets display — starting from IconVectors SVGs – Read More →

Switch to SVG Favicon (+ minimal PNG fallbacks)

By Axialis Team

Export a minified favicon.svg and generate 16×16/32×32 PNGs + favicon.ico in one pass with IconVectors. Wire up modern link tags fast – Read More →

Safari Pinned Tab “mask‑icon” (SVG) from Your Logo

By Axialis Team

Prepare a pure‑black SVG, export minified in IconVectors, add rel="mask-icon" with your brand color, and verify in Safari – Read More →

Make PWA Icon Pack with Maskable Icons (from one SVG)

By Axialis Team

Generate 192/512 PNGs and maskable variants from one SVG in IconVectors, then wire them into manifest.json and test with Maskable.app – Read More →

Using SVG Icons in C++ Native Apps (WinUI / Qt / WinAPI LunaSVG)

By Axialis Team

Export in IconVectors, then render SVGs in C++ using WinUI, Qt and Windows API with LunaSVG – Read More →

Minify & Optimize SVG for Production

By Axialis Team

1‑click Minified export in IconVectors, plus a safe SVGO setup to keep viewBox and ship tiny, themeable SVGs – Read More →

Stop Blurry Icons: Pixel‑Perfect SVG Setup

By Axialis Team

Fix soft edges for good: align shapes to pixels, pick the right stroke widths, set a clean viewBox, and verify crisp exports in IconVectors – Read More →

Build an SVG Sprite from Icons Exported with IconVectors

By Axialis Team

Export clean SVGs in IconVectors, assemble a fast sprite with the svg-sprite CLI, and reuse icons with <use>—fully themeable via currentColor – Read More →

Batch‑Export SVG to Multiple PNG Sizes in One Go

By Axialis Team

Generate complete PNG packs from one SVG using presets (1×/2×/3×) and exact pixel sizes. Perfect for web, Electron/desktop, and favicon sets – Read More →

Convert a SVG Icon to BMP

By Axialis Team

Export crisp BMPs from SVG icons while choosing the right transparency mode (24BPP flat vs 32BPP alpha) and pixel‑perfect sizes. A quick, step‑by‑step workflow for IconVectors – Read More →

Make an ICO from SVG (Windows app icons & favicons)

By Axialis Team

Export a multi‑size Windows icon (.ico) directly from your SVG in IconVectors. Learn what the ICO format contains, recommended sizes, and how to generate app & favicon sets in one pass – Read More →

Convert a SVG Icon to PNG

By Axialis Team

Export crisp PNGs from SVG icons with smooth 32BPP Alpha transparency and pixel‑perfect sizes. A quick, step‑by‑step workflow for IconVectors – Read More →

Combine SVG Shapes with Boolean Operations

By Axialis Team

This tutorial explains how boolean operations combine shapes to create clean, production‑ready SVG icons. First, we’ll demystify the basic operations—Union, Subtract, Intersect – Read More →

Make Your SVG Icons Themeable with CSS using IconVectors

By Axialis Team

One of the most common developer pain points with SVG icons is that they don't respond to CSS color. Learn how to solve this issue using IconVectors – Read More →

React TypeScript Icons — Export Typed Components

By Axialis Team

Use Case - Generate typed React components with forwardRef, a11y labels, and currentColor theming. Drop them straight into your app – Read More →

Vue TypeScript Icons — Export Typed Components

By Axialis Team

Use Case - Create Vue SFC icon components with typed props and attribute fallthrough. Theme with CSS and ship one‑file‑per‑icon – Read More →

XAML Code Icons — Export Paths for WPF & WinUI

By Axialis Team

Use Case - Export Path data and use it in WPF/WinUI with themeable brushes, Foreground binding, and resource dictionaries for reuse – Read More →

Native SVG Icons — Export and Use in Your App

By Axialis Team

Use Case - Ship clean, accessible SVGs with inline markup or sprites. Control color with CSS (currentColor) and scale perfectly with a proper viewBox – Read More →

Minified SVG Icons — Export Smaller, Faster SVGs

By Axialis Team

Use Case - Keep visuals identical while trimming bytes. Ideal for large icon sets, inline SVG, and <symbol> sprites with excellent compression – Read More →

C++ Code Icons — Render SVG in Native Apps

By Axialis Team

Use Case - Render SVG with WinUI/Win2D on Windows or Qt’s QSvgRenderer cross‑platform. Package icons as resources and recolor at runtime – Read More →