BubbleRating
Star ratings, emoji reactions, and NPS scores for your Bubble app.
Overview
BubbleRating drops a polished rating widget into any Bubble page. Pick from three styles — classic stars, emoji reactions, or NPS-style number buttons — match it to your brand, and ship in minutes. No plugins, no workflows required.
Features
- Three rating styles: stars, emoji, and numbers
- Half-star support for fractional ratings (e.g. 4.5)
- Custom primary color — six brand presets or any hex
- Three sizes: small, medium, large
- Optional label (top or bottom) and rating count
- Read-only mode for displaying ratings
- Animated hover and selection states
- Optional POST to a Bubble workflow endpoint
How to use
- 1
Go to rsvpscale.in/tools/bubblerating
Open the live builder.
- 2
Choose your style
Stars for product reviews, emojis for satisfaction, numbers for NPS.
- 3
Customize colors and size
Pick a primary color, set the size, toggle label and count.
- 4
Click "Get Embed Code"
Builder generates the iframe snippet.
- 5
Paste into Bubble HTML element
Drop, paste, ship.
Embed code example
bubble-html-element.html
<iframe
id="bubblerating-iframe"
src="https://rsvpscale.in/embed/rating?config=<your-config>"
style="width: 100%; border: 0; background: transparent; height: 0; transition: height 200ms ease;"
allowtransparency="true"
></iframe>
<script>
(function(){
window.addEventListener('message', function(e) {
if (e.data && e.data.type === 'bubblerating:height') {
var f = document.getElementById('bubblerating-iframe');
if (f) f.style.height = e.data.height + 'px';
}
});
})();
</script>Use Read Only mode to display an average rating pulled from your Bubble database.