Rayna UI
From design systemto recognised brand.
- Client
- Rayna UI (an Rvysion venture)
- Location
- USA / UK
- Category
- Brand · Product
- Services
- Brand strategy · Brand & visual identity · Design system guidelines
- Year
- 2023
What the brand helped launch
Downloads and launch ranking from Figma and Product Hunt
10,000+
downloads of the Rayna UI design system
#7
Product of the Day on Product Hunt
500+
components, all on brand
400+
icons in the duo-styled pack
01 / The brand
A design system of our own.
Rayna UI is a design system we created at Rvysion to help teams build interfaces faster and with more consistency.
With 500+ components, 150+ global Figma styles and 400+ icons, it was quickly picked up by startups, freelancers and design teams around the world. To keep growing, it needed a brand that showed its technical depth, modularity and accessibility, and spoke to designers and developers alike.
02 / The challenge
Standing out in a crowded market.
Unlike client work, Rayna UI had to win on its own in a global marketplace full of design systems. It needed an identity people would remember and trust.
- ARecognisableA unique identity that captured modularity and speed.
- BFlexibleA visual system that scales across product, website, community events and campaigns.
- CTrusted and approachableCredible for thousands of users, still friendly to indie designers and startups.
03 / The approach
Built on the product’sown values.
- 01Logo designA geometric, modular mark that stands for reuse, adaptability and structure.
- 02Colour paletteVibrant orange, lilac and green accents on stable neutrals, balancing creativity and reliability.
- 03TypographyModern, approachable typefaces built for digital-first clarity, with a handwritten accent for personality.
- 04Brand guidelinesOne system keeping product, marketing, documentation and community channels consistent.
04 / Brand applications
A living identity, built to flex.
We designed the identity to work anywhere Rayna UI shows up, from the product itself to the community around it.
Built into the design system, product dashboards and documentation.
Webinars, workshops and Rayna Sessions: Scaling Design at Speed.
Stickers, t-shirts, caps and tote bags for the community.
05 / Launch materials
Into the market with energy.
The identity carried through launch campaigns and community content, so Rayna UI arrived with clarity and energy. It launched as #7 Product of the Day on Product Hunt.
Templates for events, launches, newsletters and tips.
Countdowns, save-the-dates and a year-in-review “Design Wrapped”.
Download and usage moments, like 8K downloads on Figma, shared with the community.
06 / Brand and product, together
No gap between the marketing and the product.
Rayna UI’s identity was built to work hand in hand with the design system. Every decision, from the logo geometry to the colour palette, followed the same principles of scalability, modularity and collaboration.
500+ components and 150+ styles carry the brand into every screen teams build.
Structured, on-brand docs and a getting-started guide.
A site that shows real product examples and the system at work.
08 / Who worked on it
The people you’d actually talk to.
CollinsDesign lead · brand and design system
Next case studyLateral Frontiers WebsiteA narrative-driven website for an $89B+ portfolio VC firm, with 25% more organic traffic in three months.→