Skip to main content
The Brikl Library gives you access to hundreds of ready-to-use UI components built exclusively with native Bubble elements. Browse by category, copy any component in one click, and paste it directly into your Bubble editor.

​
How components work

Every component in the library is designed to work immediately after being pasted into your Bubble editor — no database setup, no workflows, no configuration required. Components use self-contained sample data so you can preview and test them instantly. When you’re ready, simply replace the sample data with your own data source.
All components are built with native Bubble elements. No external plugins or frameworks are required.

​
Categories

Elements

Basic UI building blocks used across any application — buttons, inputs, tables, modals, badges, tabs, tooltips, and more.

Marketing

Components built for landing pages and marketing websites — heroes, pricing sections, testimonials, FAQs, feature sections, and galleries.

Ecommerce

Everything you need for an online store — product lists, cart interfaces, checkout flows, order summaries, and review sections.

Application

Components for SaaS dashboards and web apps — sidebars, metrics, billing sections, team management, settings screens, and profile pages.

Mobile

Components optimized for mobile-first interfaces — bottom sheets, onboarding flows, mobile lists, settings navigation, and profile screens.

​
Using a component

1

Open the Brikl panel

Open your Bubble editor. The Brikl panel appears automatically on the right side of the screen.
2

Browse the library

Navigate through the categories to find the component you need. Use the search or filters to narrow down your results.
3

Copy the component

Click Copy on any component to copy it to your clipboard.
4

Paste into your editor

Click on your Bubble canvas and press Cmd + V (Mac) or Ctrl + V (Windows), or right-click and select Paste.
5

Customize it

The component is now fully editable. Adjust styles, replace sample data with your own data source, and adapt it to your project.

​
About sample data

Because components are designed to work in any Bubble project, they cannot rely on your database. Instead, each component includes built-in sample data so it renders correctly the moment you paste it. When you’re ready to connect real data, simply replace the data source in the repeating group or element with your own Bubble database type.