Does this skill help with complex icon shapes?

Yes, it demonstrates how to use GeometryGroup to combine multiple path segments, ellipses, and rectangles into a single complex icon resource.

Why should I use PathGeometry instead of PNGs for WPF icons?

PathGeometry defines icons mathematically, making them resolution-independent. This ensures they remain crisp at any zoom level or DPI setting, unlike bitmap images which can pixelate.

How do I use these icons inside a standard WPF Button?

The skill provides a custom ControlTemplate for Buttons that allows you to pass the Geometry as Content, automatically handling alignment, scaling, and interactive effects.

Can I change the color of these vector icons dynamically?

Yes, by using the Fill property with a Binding or a TemplateBinding, you can make the icon color react to themes, hover states, or view model properties.

WPF Vector Icon Creator

Name: WPF Vector Icon Creator
Author: christian289

bychristian289

•

Design Tools

Generates resolution-independent, scalable vector icons and reusable XAML styles for WPF applications.

This skill provides a comprehensive guide and implementation patterns for building professional WPF vector icons using PathGeometry and GeometryGroup. It enables developers to create resolution-independent UI elements, including symbol libraries and interactive icon buttons, while providing reusable XAML styles and a quick reference for the Path markup syntax. It is particularly useful for .NET developers looking to modernize desktop interfaces and ensure consistent visual quality across high-DPI displays.

Key Features

01Support for complex icon composition using GeometryGroup and multiple geometries

02Reusable XAML styles for IconButtons with built-in hover and pressed state triggers

03Pre-defined PathGeometry resources for common UI icons like Search, Menu, and Home

0410 GitHub stars

05Implementation patterns for dynamic icon coloring using data binding and relative sources

06Quick-reference guide for Path Mini-Language commands (Move, Line, Arc, Close)

Use Cases

01Building high-DPI aware desktop applications with crisp, scalable iconography

02Creating custom symbol libraries and standardized button styles for corporate UI frameworks

03Implementing dynamic UI themes where icons automatically adapt to foreground and background colors

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add christian289/dotnet-with-claudecode creating-wpf-vector-icons

For use in Claude.ai and ChatGPT

Download Skill