Rendered from the real SwiftUI via ImageRenderer
Product Card
NFrom Nibware - Original components, crafted in-house.
A product card with photo, rating, price and a wishlist heart.
E-commerce40 linesSwiftUIiOS 17+
The actual source
Product Card · SwiftProductCard.swift
import SwiftUI
let ecInk = Color(red: 0.11, green: 0.12, blue: 0.14)
let ecGold = Color(red: 0.98, green: 0.72, blue: 0.10)
func ecImage(_ name: String, _ w: CGFloat, _ h: CGFloat, _ r: CGFloat = 12) -> some View {
Image(name).resizable().aspectRatio(contentMode: .fill).frame(width: w, height: h)
.clipShape(RoundedRectangle(cornerRadius: r, style: .continuous))
}
func ecStars(_ rating: String, _ count: String) -> some View {Images this component uses
The code references this image by name. Download and drag into your Xcode Asset Catalog, keeping the same name, and the component renders exactly like the preview. Or swap in your own.
What it needs
Self-contained SwiftUI - system materials, SF Symbols, no external dependencies. This screen also references:
All of it - tokens, sub-views, models - is carried in the copy-paste source above.
