SVG to SwiftUI

Star on GitHub

How to Use Lucide Icons in SwiftUI & iOS

Lucide is a community-maintained fork of Feather Icons, offering a large, consistent set of clean stroke-based SVG icons. This guide shows you how to use Lucide icons in your SwiftUI and iOS apps. SwiftUI can't render SVG or icon-font files directly, so the cleanest way to get a Lucide icon onto an iPhone, iPad, or Mac screen is to convert it into a native SwiftUI Shape.

Open the converter with Lucide icons → (1,541 icons, ISC License, from lucide.dev).

Why you can't drop an SVG icon straight into SwiftUI

SwiftUI's Image view supports PNG, JPEG, PDF, and SF Symbols — but not raw SVG files or icon fonts like Lucide. Converting the icon to a SwiftUI Shape gives you a resolution-independent vector that scales perfectly at any size and can be filled, stroked, and animated like any other SwiftUI view.

Add a Lucide icon to SwiftUI in 4 steps

  1. Open the Lucide examples. Launch the converter with Lucide pre-selected in the Examples browser.
  2. Pick your icon. Search the grid and click the icon you want — its SVG loads into the editor.
  3. Convert to SwiftUI. Press Convert & Copy to generate a native SwiftUI Shape.
  4. Paste into Xcode. Drop the Swift struct into your iOS project and use it like any other view.

Example: the Lucide “star” icon in SwiftUI

Starting from the original Lucide star SVG source:

<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg">
  <path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z" />
</svg>

the converter produces this native SwiftUI Shape:

struct StarShape: Shape {
    func path(in rect: CGRect) -> Path {
        var path = Path()
        let width = rect.size.width
        let height = rect.size.height
        var strokePath2 = Path()
        strokePath2.move(to: CGPoint(x: 0.48*width, y: 0.096*height))
        strokePath2.addCurve(to: CGPoint(x: 0.5*width, y: 0.083*height), control1: CGPoint(x: 0.484*width, y: 0.088*height), control2: CGPoint(x: 0.492*width, y: 0.083*height))
        strokePath2.addCurve(to: CGPoint(x: 0.52*width, y: 0.096*height), control1: CGPoint(x: 0.508*width, y: 0.083*height), control2: CGPoint(x: 0.516*width, y: 0.088*height))
        strokePath2.addLine(to: CGPoint(x: 0.616*width, y: 0.291*height))
        strokePath2.addCurve(to: CGPoint(x: 0.682*width, y: 0.339*height), control1: CGPoint(x: 0.629*width, y: 0.317*height), control2: CGPoint(x: 0.654*width, y: 0.335*height))
        strokePath2.addLine(to: CGPoint(x: 0.898*width, y: 0.37*height))
        strokePath2.addCurve(to: CGPoint(x: 0.916*width, y: 0.385*height), control1: CGPoint(x: 0.906*width, y: 0.372*height), control2: CGPoint(x: 0.913*width, y: 0.377*height))
        strokePath2.addCurve(to: CGPoint(x: 0.91*width, y: 0.408*height), control1: CGPoint(x: 0.918*width, y: 0.393*height), control2: CGPoint(x: 0.916*width, y: 0.402*height))
        strokePath2.addLine(to: CGPoint(x: 0.754*width, y: 0.56*height))
        strokePath2.addCurve(to: CGPoint(x: 0.729*width, y: 0.638*height), control1: CGPoint(x: 0.733*width, y: 0.58*height), control2: CGPoint(x: 0.724*width, y: 0.609*height))
        strokePath2.addLine(to: CGPoint(x: 0.766*width, y: 0.852*height))
        strokePath2.addCurve(to: CGPoint(x: 0.757*width, y: 0.874*height), control1: CGPoint(x: 0.767*width, y: 0.86*height), control2: CGPoint(x: 0.764*width, y: 0.869*height))
        strokePath2.addCurve(to: CGPoint(x: 0.733*width, y: 0.875*height), control1: CGPoint(x: 0.75*width, y: 0.879*height), control2: CGPoint(x: 0.741*width, y: 0.879*height))
        strokePath2.addLine(to: CGPoint(x: 0.541*width, y: 0.774*height))
        strokePath2.addCurve(to: CGPoint(x: 0.459*width, y: 0.774*height), control1: CGPoint(x: 0.515*width, y: 0.761*height), control2: CGPoint(x: 0.485*width, y: 0.761*height))
        strokePath2.addLine(to: CGPoint(x: 0.267*width, y: 0.875*height))
        strokePath2.addCurve(to: CGPoint(x: 0.243*width, y: 0.874*height), control1: CGPoint(x: 0.259*width, y: 0.879*height), control2: CGPoint(x: 0.25*width, y: 0.879*height))
        strokePath2.addCurve(to: CGPoint(x: 0.234*width, y: 0.852*height), control1: CGPoint(x: 0.236*width, y: 0.869*height), control2: CGPoint(x: 0.233*width, y: 0.86*height))
        strokePath2.addLine(to: CGPoint(x: 0.271*width, y: 0.638*height))
        strokePath2.addCurve(to: CGPoint(x: 0.246*width, y: 0.56*height), control1: CGPoint(x: 0.276*width, y: 0.609*height), control2: CGPoint(x: 0.267*width, y: 0.58*height))
        strokePath2.addLine(to: CGPoint(x: 0.09*width, y: 0.408*height))
        strokePath2.addCurve(to: CGPoint(x: 0.084*width, y: 0.385*height), control1: CGPoint(x: 0.084*width, y: 0.402*height), control2: CGPoint(x: 0.082*width, y: 0.393*height))
        strokePath2.addCurve(to: CGPoint(x: 0.102*width, y: 0.37*height), control1: CGPoint(x: 0.087*width, y: 0.377*height), control2: CGPoint(x: 0.094*width, y: 0.372*height))
        strokePath2.addLine(to: CGPoint(x: 0.317*width, y: 0.339*height))
        strokePath2.addCurve(to: CGPoint(x: 0.384*width, y: 0.291*height), control1: CGPoint(x: 0.346*width, y: 0.335*height), control2: CGPoint(x: 0.371*width, y: 0.317*height))
        strokePath2.closeSubpath()
        path.addPath(strokePath2.strokedPath(StrokeStyle(lineWidth: 0.083*width, lineCap: .round, lineJoin: .round, miterLimit: 4)))
        return path
    }
}

Then use it anywhere in your SwiftUI layout:

StarShape()
    .fill(Color.accentColor)
    .frame(width: 100, height: 100)

Frequently asked questions

Is Lucide free to use in iOS apps?

Lucide is distributed under the ISC License. Always check the official Lucide license for the exact terms before shipping.

Do I need a third-party package to use Lucide in SwiftUI?

No. Converting the icon to a SwiftUI Shape produces plain SwiftUI code with no dependencies — paste it straight into your project.

Convert your Lucide icon now

Open the Lucide icon browser, pick an icon, and copy the SwiftUI code. For more detail on how the conversion works, read the SVG to SwiftUI guide.