Phosphor Icon

About the Phosphor Icons app

The Phosphor Icons app helps teams standardize how icons are selected and rendered across front-end experiences by bringing the Phosphor icon library directly into Contentful.

Editors browse and search the Phosphor library by name, keyword, and tag, then choose the weight and position that best fit their content. Behind the scenes, the app saves each selection as structured JSON (including icon name, component name, weight, and position), providing developers a consistent payload they can plug into React, CSS classes, or other frontends without changing the content model.

Configurable options let admins control which icon weights, positions, and even which specific icons are available in each space. This keeps editorial workflows flexible while allowing design and platform teams to enforce brand consistency and layout rules from the frontend, not from within content.

Features

• Visual icon selection: Browse and search icons visually from the Phosphor library, so editors work with icon previews instead of enums or token strings.
• Consistent front-end rendering: Store icon choices as structured JSON with icon name, component name, weight, and position, providing a stable, implementation-agnostic contract for rendering icons across frontends.
• Governed icon controls: Control which icons, weights, and positions are available per space to keep editorial workflows flexible while enforcing design and layout standards.

Screenshots