Illustration
Rayna UI - 500+ Component library system & UI kit for modern UI design | Product Hunt

Transform your Designs with our FREE modern UI Figma design system

Rayna UI, your design buddy - that provides you with intuitive, adaptive, and customizable UI components to help you create exceptional designs.

500+

UI Components

159+

Styles

250+

Icons

50+

UI Templates

We are dedicated to being the design system... not UI Kit

We understand the pain of designing new components for each project while adhering to consistency, neatness, and speed. We are dedicated to being the design system that helps you create excellent projects hassle-free.
Get Rayna UI
Get Rayna UI
Alison
You
Fayemi David
Rayna Sync

Features

With Rayna UI, your creative freedom knows no bounds. Whether you're a seasoned designer or just starting your journey, Rayna UI ensures that your designs remain true to your vision, every step of the way.
Well documented components
Our comprehensive documentation provides clear, concise guidance on how to make the most of our design system.
Well documented components
UI templates for different industries
Whether you're designing for a sleek, modern app or a vibrant creative platform, you'll find the perfect template to suit your style and industry.
Rayna UI Kit
Built for collaboration
Designing with a team? Rayna UI is your collaborative toolkit. Allowing designers to work together in real-time and share feedback.
Built for collaboration
Accessibility first approach
Design with inclusivity in mind. Rayna UI incorporates accessibility best practices, ensuring that your interfaces are accessible to all users.
Accessibility

Publish to your library

Publishing Rayna UI to your Library is a fantastic opportunity to elevate and showcase your design skills, contribute to a large community of design enthusiasts while gaining recognition for your work. It's time to let your designs take center stage.
Charts & Graphs
Visualize data like never before. Create stunning charts, graphs, and infographics to convey complex information with clarity.
Forms
Forms that engage. Our forms module equips you with a comprehensive set of form components.
Navigation
Navigate with style. Our navigation module offers array of components, from sleek menus to responsive navigation bars.
Dashboards
Command your data. Our dashboard module empowers you to design data-driven dashboards and interfaces.

Most adaptable UI library

We understand that design needs vary from project to project, and that's why we've built Rayna UI to have the most adaptable UI library you've ever encountered.
UI Components
UI components
Customizable components that contain everything you need to design smoothly
Color System
Color system
Rayna UI's color system adds vibrancy and cohesion to your designs
Icons
Icon library
Our vast icon library are consistent, high-resolution, and meticulously crafted
Illustrations
Illustrations
Rayna UI's illustrations are designed to inject life into your designs
Typography
Typography
Our typography styles helps you organize your texts for consistency
Spacing Grids
Spacing and Grids
Create designs that align flawlessly with Rayna UI's spacing and grids guide

Built on Rayna

Join the ranks of designers, industry leaders, and innovators who have harnessed Rayna UI to create design masterpieces.
Saviourr Inyang
@saviourrinyang
Nov 8, 2023
Twitter Icon
Ozenua Oluwatobi
@ozenua_
Jan 25, 2024
Twitter Icon
Abiodun
@Biodunidowu_
Nov 14, 2023
Twitter Icon
Abiodun
@Biodunidowu_
Nov 14, 2023
Twitter Icon
Dare Oyejide
@dareoyejide
Dec 8, 2023
Twitter Icon
Dare Oyejide
@dareoyejide
Dec 8, 2023
Twitter Icon
Dare Oyejide
@dareoyejide
Dec 8, 2023
Twitter Icon
Dare Oyejide
@dareoyejide
Dec 8, 2023
Twitter Icon
Yasmeen
@theyasmeeniah
Dec 16, 2023
Twitter Icon
Yasmeen
@theyasmeeniah
Dec 17, 2023
Twitter Icon
Mofifoluwa 👩‍💻👓✨
@mofifoluosaks
Dec 21, 2023
Twitter Icon
Lare, the Designer👨🏾‍💻
@olutidare_
Dec 30, 2023
Twitter Icon
Lare, the Designer👨🏾‍💻
@olutidare_
Dec 30, 2023
Twitter Icon
Lare, the Designer👨🏾‍💻
@olutidare_
Dec 30, 2023
Twitter Icon
tosin Grace 'n' vibes
@2cene
Feb 26, 2024
Twitter Icon
Alison Eyo
@thealisoneyo
Feb 13, 2024
Twitter Icon
Alison Eyo
@thealisoneyo
Jan 12, 2024
Twitter Icon
Alison Eyo
@thealisoneyo
Jan 11, 2024
Twitter Icon
Alison Eyo
@thealisoneyo
Jan 10, 2024
Twitter Icon
Alison Eyo
@thealisoneyo
Jan 16, 2024
Twitter Icon
Alison Eyo
@thealisoneyo
Jan 16, 2024
Twitter Icon
Alison Eyo
@thealisoneyo
Jan 24, 2024
Twitter Icon
Gaga.
@Johnogaga4
Jan 24, 2024
Twitter Icon
Alison Eyo
@thealisoneyo
Jan 23, 2024
Twitter Icon
John Olukitibi
@Doc_of_Designs
Jan 29, 2024
Twitter Icon
John Olukitibi
@Doc_of_Designs
Jan 26, 2024
Twitter Icon
John Olukitibi
@Doc_of_Designs
Jan 25, 2024
Twitter Icon
John Olukitibi
@Doc_of_Designs
Jan 25, 2024
Twitter Icon
John Olukitibi
@Doc_of_Designs
Jan 24, 2024
Twitter Icon
Alison Eyo
@thealisoneyo
Jan 22, 2024
Twitter Icon
Saviourr Inyang
@saviourrinyang
Nov 8, 2023
Twitter Icon
Ozenua Oluwatobi
@ozenua_
Jan 25, 2024
Twitter Icon
Abiodun
@Biodunidowu_
Nov 14, 2023
Twitter Icon
Abiodun
@Biodunidowu_
Nov 14, 2023
Twitter Icon
Dare Oyejide
@dareoyejide
Dec 8, 2023
Twitter Icon
Dare Oyejide
@dareoyejide
Dec 8, 2023
Twitter Icon
Dare Oyejide
@dareoyejide
Dec 8, 2023
Twitter Icon
Dare Oyejide
@dareoyejide
Dec 8, 2023
Twitter Icon
Yasmeen
@theyasmeeniah
Dec 16, 2023
Twitter Icon
Yasmeen
@theyasmeeniah
Dec 17, 2023
Twitter Icon
Mofifoluwa 👩‍💻👓✨
@mofifoluosaks
Dec 21, 2023
Twitter Icon
Lare, the Designer👨🏾‍💻
@olutidare_
Dec 30, 2023
Twitter Icon
Lare, the Designer👨🏾‍💻
@olutidare_
Dec 30, 2023
Twitter Icon
Lare, the Designer👨🏾‍💻
@olutidare_
Dec 30, 2023
Twitter Icon
tosin Grace 'n' vibes
@2cene
Feb 26, 2024
Twitter Icon
Alison Eyo
@thealisoneyo
Feb 13, 2024
Twitter Icon
Alison Eyo
@thealisoneyo
Jan 12, 2024
Twitter Icon
Alison Eyo
@thealisoneyo
Jan 11, 2024
Twitter Icon
Alison Eyo
@thealisoneyo
Jan 10, 2024
Twitter Icon
Alison Eyo
@thealisoneyo
Jan 16, 2024
Twitter Icon
Alison Eyo
@thealisoneyo
Jan 16, 2024
Twitter Icon
Alison Eyo
@thealisoneyo
Jan 24, 2024
Twitter Icon
Gaga.
@Johnogaga4
Jan 24, 2024
Twitter Icon
Alison Eyo
@thealisoneyo
Jan 23, 2024
Twitter Icon
John Olukitibi
@Doc_of_Designs
Jan 29, 2024
Twitter Icon
John Olukitibi
@Doc_of_Designs
Jan 26, 2024
Twitter Icon
John Olukitibi
@Doc_of_Designs
Jan 25, 2024
Twitter Icon
John Olukitibi
@Doc_of_Designs
Jan 25, 2024
Twitter Icon
John Olukitibi
@Doc_of_Designs
Jan 24, 2024
Twitter Icon
Alison Eyo
@thealisoneyo
Jan 22, 2024
Twitter Icon

Wall of loveee 💖

See what the community is saying about Rayna UI. Share your thoughts, experiences, and feedback on Rayna UI.
Jeorge
Sep 11
Twitter IconPinterest IconFigma iconLinkedin Icon

Looks promising, i'd definitely like to try it!

kika
Oct 3
Twitter IconPinterest IconFigma iconLinkedin Icon

GM .....what are you working on today? Peep the navigation from @rayna_ui too clean

Ajibola
Sep 11
Twitter IconPinterest IconFigma iconLinkedin Icon

This work you and your team put into this is amazing. I have the file now and I can say this will help a lot. If you're a designer, check @Rayna_UI, visit the website on the bio, and get the figma file once you enter your email. You'll be glad you have the file

Yusuf
3 months ago
Twitter IconPinterest IconFigma iconLinkedin Icon

Amazing system, Can not believe it's free. Kudos to the team behind thid

Ogochukwu Obiajulu Onyema
2 months ago
Twitter IconPinterest IconFigma iconLinkedin Icon

This looks very neat and well thought out. Kudos to the team

Angela Ifebunandu
3 months ago
Twitter IconPinterest IconFigma iconLinkedin Icon

I love how neat and easy the assets look, it shows that every little detail was well thought out. chefs kiss

that black designer
Sep 12
Twitter IconPinterest IconFigma iconLinkedin Icon

playing around with @Rayna_UI, loving it so far

Da Vinci of design
Oct 3
Twitter IconPinterest IconFigma iconLinkedin Icon

just cooked a dashboard with @rayna_ui. the most seamless thing I've done this year

Angela Ifebunandu
Sep 11
Twitter IconPinterest IconFigma iconLinkedin Icon

Excellence, ease, speed and user friendly are some of the words to describe rayna ui and what it stands for. The consistency of each element shows the effort the tea put into this project to ensure it stands out. Rayna ui to the world!!!

that black designer
Sep 11
Twitter IconPinterest IconFigma iconLinkedin Icon

An amazing product, the build is lovely. thanks to the Rayna team

Hanifa
3 months ago
Twitter IconPinterest IconFigma iconLinkedin Icon

The consistency in design across all assets is impressive. It makes everything feel cohesive!

Bhorie
Sep 11
Twitter IconPinterest IconFigma iconLinkedin Icon

I love how clean and easy to use it is. The get started page alone basically taught me something new this morning. can't wait to explore it some more.

Ifunanya Onwughalu
Sep 13
Twitter IconPinterest IconFigma iconLinkedin Icon

So last night I did. a thing with @Rayna_UI. the customer testimonial section was inspired by @ozenua_ . this design system is actually designing

Sola Alagbe
3 months ago
Twitter IconPinterest IconFigma iconLinkedin Icon

Amazing Resource! Thank you to the Rayna UI Team

Design Thinking Practitioner
Sep 11
Twitter IconPinterest IconFigma iconLinkedin Icon

Waking up to see design buddy @Rayna_UI update. I've been looking forward to the release and today it came at the right time

Sauce
Sep 11
Twitter IconPinterest IconFigma iconLinkedin Icon

Rayna UI kit is absolutely magnificent. kudos to the team @Rayna_UI

Ruqayyah
2 months ago
Twitter IconPinterest IconFigma iconLinkedin Icon

I really love this. Welldone guys!

Einstein
Sep 11
Twitter IconPinterest IconFigma iconLinkedin Icon

What a time to be alive! .....Kudos to the team for this amazing resources

Barney
Sep 12
Twitter IconPinterest IconFigma iconLinkedin Icon

This is a special shout-out to @Rayna_UI team.....that's proper work, too detailed and it's free

AMORUE DANIEL
3 months ago
Twitter IconPinterest IconFigma iconLinkedin Icon

I love it! thank yiu Rayna

Ashar Iqbar | Ui/UX designer
Oct 4
Twitter IconPinterest IconFigma iconLinkedin Icon

created with @rayna_ui

the confident designer
Sep 12
Twitter IconPinterest IconFigma iconLinkedin Icon

the guys @Rayna_UI really put in a lot of good work into it. A well detailed design system I stan!

Eugene Adavore
3 months ago
Twitter IconPinterest IconFigma iconLinkedin Icon

This is phenomenal work!!

Yuusuf Oyelola Oladipo
Sep 11
Twitter IconPinterest IconFigma iconLinkedin Icon

Simple, easy to use. It doesn't matter if you are not UII focused person, the documentations are detailed and helps a lot.

Ozenua Oluwatobi
Oct 3
Twitter IconPinterest IconFigma iconLinkedin Icon

dashboard designs got ridiculously easy with @rayna_ui especially with the tables. life's sweet

Benjamin | Design Prince
Sep 11
Twitter IconPinterest IconFigma iconLinkedin Icon

Took time out to check out @Rayna_UI design system and truly loads of work has been put into it. Well done team.

Maria Ko
2 months ago
Twitter IconPinterest IconFigma iconLinkedin Icon

Incredible work!

Heleana from videodeck.co
Twitter IconPinterest IconFigma iconLinkedin Icon

This sounds like a designer's dream! Being so involved in video production for SaaS, WE OFTEN LOOK FOR WAYS TO MAKE OUR VISSUALS POP. I've got to ask; with such a diverse library of components and elements, do you have any plan to include video or motion graphic integrations withon the sysyem? It could be a game changer for blending ui designs with video storytelling! Cheers to innovative design solutions!!

Dot Branding
2 months ago
Twitter IconPinterest IconFigma iconLinkedin Icon

An amazing free design system kit

Alison Eyo
Sep 15
Twitter IconPinterest IconFigma iconLinkedin Icon

Rayna Range.....designed with @rayna_Ui . transform your designs with Rayna UI v1.0 for free

Vanessa Oparaugo
3 months ago
Twitter IconPinterest IconFigma iconLinkedin Icon

It's really clear and organised, seeing the documentation is really helpful. Great job!

Abubakar S. Ismail
Sep 11
Twitter IconPinterest IconFigma iconLinkedin Icon

@Rayna_UI is finally live, upvoted and definitely testing this out

Nsikan Etukudoh
Sep 11
Twitter IconPinterest IconFigma iconLinkedin Icon

y'all @Rayna_UI did a great job!

snow
Nov 4
Twitter IconPinterest IconFigma iconLinkedin Icon

checks out my article on design system using @rayna_ui as a case study

Dominik Oslizlo
1 month ago
Twitter IconPinterest IconFigma iconLinkedin Icon

Very well constructed, a rare find.

Ogaga John
3 months ago
Twitter IconPinterest IconFigma iconLinkedin Icon

I love the free empty state illustration state and icon library

Davidking Igwela
3 months ago
Twitter IconPinterest IconFigma iconLinkedin Icon

Simple UI Great job!

ozieh victor kikachukwu
Sep 28
Twitter IconPinterest IconFigma iconLinkedin Icon

A must have for teams , super clean ui elements

Mario Francis
3 months ago
Twitter IconPinterest IconFigma iconLinkedin Icon

Mehn can't wait to use this o my current project.

Abdullah
2 months ago
Twitter IconPinterest IconFigma iconLinkedin Icon

Loved it

dot branding
Sep 11
Twitter IconPinterest IconFigma iconLinkedin Icon

An amazing design system, made with love for the community and it is free. This iss a very amazing starting point for designers

OlaleyeJedidiah is Job hunting
Sep 13
Twitter IconPinterest IconFigma iconLinkedin Icon

thank you to the team @Rayna_UI, you're making my work more seamless and mature

design.ai
Oct 5
Twitter IconPinterest IconFigma iconLinkedin Icon

Rayna UI is like having a secret weapon for my projects and I'm loving every moment of using it. big shout-out to the creators

Collins Donye
Sep 13
Twitter IconPinterest IconFigma iconLinkedin Icon

Definitely having fun exploring @rayna_ui mid work. file manager design exploration

Benjamin | Design Prince
Sep 11
Twitter IconPinterest IconFigma iconLinkedin Icon

Finally @Rayna_UI is live

Ba_wwal
Sep 30
Twitter IconPinterest IconFigma iconLinkedin Icon

I love the way I am turning @muiz_ola and my idea into something nice with @rayna_ui

Tsavsar
Oct 25
Twitter IconPinterest IconFigma iconLinkedin Icon

Easy to use and literally has everything

web3mc
Nov 4
Twitter IconPinterest IconFigma iconLinkedin Icon

Rayna UI is a person, she's a babe, a badie - Alison Eyo. @rayna_ui #raynacommunitylauch

Lazar Krstic
Sep 11
Twitter IconPinterest IconFigma iconLinkedin Icon

It looks very quality, I will think about using it on some projects in the future

Tassy Omah
2 months ago
Twitter IconPinterest IconFigma iconLinkedin Icon

Wish i could rate more than 5 stars! This is incredible work guys

Oladayo Olawuni
3 months ago
Twitter IconPinterest IconFigma iconLinkedin Icon

Just perfect!

6lack_american
Sep 12
Twitter IconPinterest IconFigma iconLinkedin Icon

WIP. Tried using @Rayna_UI design system for this particular design and I'm loving it

Sugar Shah
3 months ago
Twitter IconPinterest IconFigma iconLinkedin Icon

Absolutely stunning work. Thank you guys for making it for free.

Wadex
3 months ago
Twitter IconPinterest IconFigma iconLinkedin Icon

Great work!

Ikedi Eze
3 months ago
Twitter IconPinterest IconFigma iconLinkedin Icon

Solid work

Caveman
3 months ago
Twitter IconPinterest IconFigma iconLinkedin Icon

excited to witness the birth of this. hehe

Pascal Ewaat
3 months ago
Twitter IconPinterest IconFigma iconLinkedin Icon

Excellent work by the team. The more you click on the pages, the more you're impressed. Awesome.

olamide akoja
Oct 7
Twitter IconPinterest IconFigma iconLinkedin Icon

@rayna_ui design system thank you

Adekunle Ibrahim
Sep 11
Twitter IconPinterest IconFigma iconLinkedin Icon

The design system, is very clean and minimal. Eady readilable as i can scan through the asset with few mouse panout and get what i need out of it asap. This is a big complimentary effort to my current workflow. Can't wait for what the team would deliver for version 2.

Exon Nkemchor
11 days ago
Twitter IconPinterest IconFigma iconLinkedin Icon

You guys did amamzing on this one. Go team Rayna

Yusuf
Sep 11
Twitter IconPinterest IconFigma iconLinkedin Icon

Great work done by the team

Stephen the Lagos boy
Sep 15
Twitter IconPinterest IconFigma iconLinkedin Icon

God bless you @thealisoneyo for @rayna_ui

kayboy
Oct 7
Twitter IconPinterest IconFigma iconLinkedin Icon

designed using @rayna_ui . makes everything so easy

mp
3 months ago
Twitter IconPinterest IconFigma iconLinkedin Icon

absolutetely amazing stuff! can tell a lot of work went into putting this together

Omotayo
Sep 11
Twitter IconPinterest IconFigma iconLinkedin Icon

I just saw the motion video for Rayna. To be honest, I'm blown. That's a lot of resources for smart peeps

Take your designs to new dimensions

Join 8,600+ designers, innovators, and creators who have embraced excellence, innovation, and creativity.
CommentCommentComment
CommentCommentComment
CommentCommentComment
CommentCommentComment
CommentCommentComment
CommentCommentComment
CommentCalendarPayment Info
CommentCalendarPayment Info

Frequently asked questions

What is Rayna UI?
Rayna is a comprehensive design system and component library built specifically for Figma (V1.0). It provides a set of pre-designed UI elements, components, and guidelines that ensure consistent and efficient design across your projects.
How do I get started with Rayna?
Simply duplicate the library into your Figma projects to start utilizing its design assets and components.
Can I customize the Rayna components to match my brand's style?
Yes, absolutely! Rayna components are designed with customization in mind. You can easily adjust colors, typography, and other design attributes to align with your brand's unique identity while maintaining the consistency that Rayna offers.
Will updates be made to the design system?
Yes, updates to Rayna will be made in the near future. You'll be notified of any updates, and you can seamlessly integrate the latest versions into your ongoing projects.
Can I collaborate with my team using Rayna in Figma?
Yes, Rayna is fully compatible with Figma's collaboration features. You and your team can work together in real-time, utilizing the design system's components to streamline your design process and maintain a unified look and feel.
Are there any tutorials or guides available for using Rayna effectively?
Absolutely. We provide comprehensive documentation and tutorials to help you make the most of Rayna. You'll find step-by-step guides, best practices, and usage examples to assist you in using the design system efficiently.
Is Rayna V1.0 free to use?
Yes, Rayna is available for free. You can access and utilize the design system and component library in your Figma projects without any cost.
Can I contribute to the Rayna design system?
Yes, we encourage contributions from the community! If you have ideas for new components, improvements, or optimizations, you can reach out to us via email (alison@raynaui.com), or any of our social media DMs. We believe collaborative efforts make Rayna even more robust.
Can I request new features or components for future updates?
Absolutely! We value user feedback and take feature requests seriously. If there's a specific component or feature you'd like to see in Rayna, please let us know through our social media DMs.
What accessibility considerations are integrated into Rayna?
Accessibility is a priority for us. Rayna includes components designed with accessibility in mind, following WCAG guidelines. This ensures that your designs are inclusive and can be used by a diverse audience.
How do I stay updated with the latest news about Rayna?
To stay informed about the latest Rayna updates, releases, and news, you can follow us on Twitter, and Instagram & subscribe to our channel on YouTube. We'll share regular updates on our socials.
Can I use Rayna for personal and commercial projects?
Yes, Rayna is available for both personal and commercial use. Whether you're working on personal projects, freelance work, or corporate initiatives, you're welcome to integrate Rayna into your designs.