Figma Themes & UI Kits - Where To Find Design Inspiration
In this Bubble.io tutorial video we share some of the top places to look for design inspiration, UI kits and themes for your Bubble app.
Unlock stunning UI designs: Discover 3 secret sources for UI design inspiration that will transform your Bubble app!
From CRM to task manager: Learn how to leverage premium UI kits to build professional-looking CRM and productivity apps in Bubble.
Elevate your Bubble app's design: Explore affordable templates for landing pages, dashboards, and more to take your Bubble app to the next level.
Finding Design Inspiration for Bubble Apps
I remember when in 2017 I just discovered Bubble and I started building my first app, sort of a CRM, and there came a point when I realized I'm not good at UI design. If you too have reached a similar point then this quick video is for you because I'm going to show you the three places that I look for inspiration and also have purchased UI kits and themes before to build them into the Bubble apps that I create.
UI8: High-Quality UI Kits and Themes
So the first one, let's go with UI8. I think that the quality of the UI kits and the themes available on this website are second to none. So we can do a search for CRM and you can see graphics that you could put into your app but there are templates just like here. And so for not too much money you can go ahead and you can purchase this and you can open it in Figma and you can see exactly what fonts we use, the size, the indentations, the margins, the padding. You can do all of that plus some of them too, they'll come with a tablet and a mobile view too.
Benefits of Using UI Kits
So much of the hard work and the immense amount of skill that's required to design something like this is taken off your plate and you're able to purchase it. And with a little bit of grappling with Figma you're able to build these designs into your web app. Let's just see if we can find a few more on UI8, maybe like a task manager. So I would say that on UI8 a lot of them do lean towards mobile. I have sometimes taken a mobile UI kit and just worked my way through building it into a desktop.
Adapting Mobile UI Kits for Desktop
I prefer not to do that because it does take quite a bit of creativity to fill in the gaps and kind of expand the width of the screen. But here's another one, it's got a desktop. So we go very simple but if you're thinking of building your own task manager and you're just really not sure where to start then this template UI kit rather for $15 gets you a very long way and you can see that it's very pleasing to the eye and it has a lot of the core features or a designed and planned out that you might have with a task manager.
Theme Forest: Templates for WordPress and Static Content
Something like Theme Forest is very big for WordPress sites and if your Bubble site is not just operating as a web app but you're going to need landing pages, more of your static web content such as an about page, your contact page, then you'll find a huge amount of templates available. And also worth pointing out there's a lot of crossover between these platforms. People who create these templates and put them up for sale likely list them in several places.
Finding Dashboard Templates
So let's have a look for say dashboard template. There you go, you are going to be scrolling for a long time to get to the bottom. There are all of these different dashboards that are not expensive at all that you can purchase and then you can using either Figma or using the kind of inspect element tool of your browser if it's an HTML template you can be building and kind of translating them from Figma or from HTML over into your Bubble app.
Creative Market: Another Source for UI Kits
And then the last place that I've started looking within the last few months for inspiration and to purchase UI kits is Creative Market. And so you can see here I've done a search for CRM, B to CRM, we saw that on UI 8. But again there's just a lot to choose from and many of them have got HTML demos so you can really go through them and see, mix and match the information, say take some charts for example that you want to display in your Bubble web app and you can just see how the designer of these UI kits has gone about displaying chart content.
Conclusion and Invitation for Recommendations
So anyway I hope that's really helpful, if you've got any further recommendations please put them in the comments below because I know a lot of us out there when we start out with Bubble we're a solo team and when you're looking to launch your products in Bubble you're filling in many many roles at once and at least for me personally one of the trickiest has been design, so these are the places that I've looked for inspiration.
Can't find what you're looking for?
Search our 300+ Bubble tutorial videos. Start learning no code today!
Flexible Pricing Plans to Fit Your No-Code Journey
Choose the plan that aligns with your goals and start building your startup today.
Have questions?
We have answers!
Find answers to common questions about our membership plans, programs, and more.
Both plans offer full access to our learning resources, community, and support. The Annual plan provides a significant discount (over 15%) compared to paying monthly, and it allows you to lock in your rate for a full year.
Absolutely! You can easily upgrade or downgrade your membership plan at any time by logging into your account and selecting the desired plan. Any unused portion of your current plan will be prorated and applied to your new plan.
As a Planet No Code member, you'll receive a discount on our Bubble coaching sessions. Monthly members receive a 10% discount, while Annual members receive a 17.5% discount. To redeem your discount, simply log into your account and book a coaching session through our platform.
Our 8-week intensive mentorship program is designed to provide personalized guidance and support to help you accelerate your startup journey. You'll be matched with a startup expert who will work with you one-on-one to set goals, overcome challenges, and make rapid progress.
To apply for the Mastery Program, simply click the "Request Invitation" button on our pricing page and fill out the application form. Our team will review your application and schedule a call with you to discuss your goals and determine if the program is a good fit for your needs.
We accept all major credit cards, including Visa, Mastercard, American Express, and Discover.
While we don't offer a free trial, we do provide a 14-day money-back guarantee. If you're not completely satisfied with your membership within the first 14 days, simply contact our support team, and we'll issue a full refund.
If you decide that Planet No Code isn't the right fit for you, you can cancel your membership at any time by logging into your account and navigating to the subscription management page. Click the "Cancel Membership" button, and your membership will be terminated at the end of your current billing cycle.