Margins & Padding
Discover how Bubble.io's Margins & Padding feature empowers solopreneurs to create visually stunning no code SaaS applications, allowing precise control over element spacing and layout without writing a single line of code.
![](https://cdn.prod.website-files.com/6659f119bb64f1f63f34e4ba/66670a1633abeda05b51a304_thumbnail_a6759fc1.png)
Create a responsive homepage hero section in Bubble
In this Bubble tutorial video we demonstrate who to create a responsive hero section in your Bubble app.
![](https://cdn.prod.website-files.com/6659f119bb64f1f63f34e4ba/66670a8b27378b1ad29f12db_Consistent-margin.jpeg)
How to create a consistent margin around page content using Groups
In this Bubble.io tutorial video we demonstrate how to achieve a consistent and clean layout with a 20 pixel margin surrounding the inner content of your page in the Bubble editor.
![](https://cdn.prod.website-files.com/6659f119bb64f1f63f34e4ba/66670a1a53b7aa6f742e0ee8_5.png)
How to create a responsive header and dropdown menu bar
In this Bubble.io tutorial we demonstrate how to create a responsive header bar and dropdown sub menu for your Bubble app.
![](https://cdn.prod.website-files.com/6659f119bb64f1f63f34e4ba/66670a7a911d56c45c536404_Design-Tips.png)
Repeating Group Bubble.io design tips
In this Bubble tutorial we demonstrate our top tips for designing great looking repeating groups in your Bubble app.
Explore more of our no code tutorials
Discover more Bubble tutorials
Start building your No Code SaaS with Bubble.io & Planet No Code
![](https://cdn.prod.website-files.com/6659f119bb64f1f63f34e4ba/66670a8cf4e63adecfc0dbdd_WEBHOOK.png)
Generate version specific webhook URLs
In this Bubble.io tutorial, we dive into the intricate world of webhooks in data processing for your Bubble app. If you're using a third-party service like AssemblyAI, a high-performing speech-to-text API, this video is a must-watch. We address a common issue where the webhook works perfectly in the development version but fails in the live version - a problem that can be easily solved with the right approach.
![](https://cdn.prod.website-files.com/6659f119bb64f1f63f34e4ba/6669946576c152c1a7a0d356_Which-is-better_-OpenAI-vs-Claude-3-An-Introduction.png)
Which is better? OpenAI vs Claude 3 - An Introduction
Learn about the latest advancements in AI models like Claude Haiku, Claude Sonnet, and Claude Opus and their comparison to OpenAI for building no-code web apps with Bubble.io in mind. Stay tuned for upcoming videos on integrating these models into your projects!
![](https://cdn.prod.website-files.com/6659f119bb64f1f63f34e4ba/66670a7a911d56c45c536404_Design-Tips.png)
Repeating Group Bubble.io design tips
In this Bubble tutorial we demonstrate our top tips for designing great looking repeating groups in your Bubble app.
![](https://cdn.prod.website-files.com/6659f119bb64f1f63f34e4ba/66698f440942de5fdf2bce23_youtube-thumbnail-6-768x432.png)
Creating a Chatbot experience using Bubble & ChatGPT API
In this Bubble tutorial we demonstrate how to use the ChatGPT API to create an AI chatbot like experience in your Bubble app. We dive right the deep end of the Bubble API Connector, we have getting started videos for the OpenAI API on our channel already. This video shows one way to approach the challenge of formating the message history correctly in JSON so that your chatbot is aware of the message history and respond accordingly.
![](https://cdn.prod.website-files.com/6659f119bb64f1f63f34e4ba/66670a243fc51aa36bd34314_kTPghopzvMY-HD.jpeg)
Responsive Engine: adding overlay icon in text Input
In this Bubble.io tutorial video we explore one way to add icons to your text Input fields in your Bubble.io app.
![](https://cdn.prod.website-files.com/6659f119bb64f1f63f34e4ba/66670a78b4d2b4f70da0e137_Lemon-Squeezy-Customer-Portal.png)
Bubble.io & Lemon Squeezy Customer Portal
In this Bubble tutorial video we demonstrate how to seamlessly log a user into the Lemon Squeezy Customer Portal. Using the Lemon Squeezy Customer portal will save you hours of development time!