svgs

SVG Resources for Power Apps

Table of Contents

• Start Here
• Quick Start
  • Display an SVG in Power Apps
  • Use Theme Colors with SVGs
• Contents
• External Resources

This directory contains SVG icons, documentation, and code patterns for working with SVGs in Power Apps.

Start Here

1. INDEX.md - Complete searchable catalog of all SVG files
2. Best SVG Snippet - Comprehensive guide to SVG usage
3. SVG Files - Actual SVG icon files

Quick Start

Display an SVG in Power Apps

// In an Image control's Image property:
"data:image/svg+xml;utf8," & EncodeUrl("<svg>...</svg>")

Use Theme Colors with SVGs

// Replace default color with app theme color
With(
    {
        svgCode: "<svg>...</svg>",
        themeColor: Left(Substitute(JSON(App.Theme.Colors.Primary), """", ""), 7)
    },
    "data:image/svg+xml;utf8," & EncodeUrl(
        Substitute(svgCode, "#000000", themeColor)
    )
)

Contents

Resource	Description
INDEX.md	Complete SVG catalog with paths and descriptions
svg-files/	Icon files organized by category
best-svg-snippet.md	Detailed SVG implementation guide
basic-spinner.md	Animated spinner implementation
replace-color-in-svg.md	Color replacement function
svgs.md	Additional resources and links

External Resources

• 2,000 Free Power Apps Icons
• SVG Video Playlist
• Microsoft Branding Guidelines

---

History

Date	Author	Changes
2026-01-27	Migration	Initial TOC and history section added