Launched at a time when SVG icons were taking over from icon fonts as the standard for UI design and development, Orion was built to meet that shift with a cutting-edge platform for both consuming and managing icons. I designed the full architecture of the application — from the internal icon database to the user-facing customization flows and the admin tooling behind it.
Icon Database & Access
The platform is built around an in-house database of carefully designed icons, each available in multiple styles (stroke, fill, color, and flat). Access is tiered between free and pro, with advanced features and extended icon sets reserved for pro users. Beyond browsing, users can upload their own icons into the platform, making it a hybrid between a curated library and a personal asset manager.
Customization Engine
The core of the platform is a real-time customization engine that allows users to edit icons at a deep level: multi-color and monochrome modes, per-layer color control, stroke weight adjustments, and live visual preview. To support precise programmatic manipulation of SVG properties, I developed svgson — an open-source library that converts SVGs into a structured JSON representation and back, enabling reliable parsing, editing, and serialization of icon data.
Collections, Export & Sharing
Users can organize icons into collections — internal workspaces to group icons per project. From there, icons can be exported in multiple formats for design and development use, or shared directly via link.
Architecture
The front end is built with Next.js, handling real-time state, rendering, and user interactions. The back end runs on Node.js, exposing APIs for icon data, customization metadata, permissions, collections, uploads, and sharing. Firebase is used for data storage and auth, with the SVG engine operating as a dedicated processing layer across both sides.