Animated Color Strip

Demo to preview the plugin:

Introduction

This is a simple plugin that allows you to add animated color strips to your Bubble application.
You can choose between three different sizes and specify the colors.
You can use the color strips as a loading animation or to enhance the user interface/experience of your application.
Image without caption

How to setup

  1. Add one of the three color strip elements to your Bubble app:
    1. Elements.
      Elements.
      • Small – 10px height
      • Medium – 30px height
      • Large – 60px height
  1. Control visibility dynamically
    1. You can specify the colors that should be displayed within the element inspector. You can toggle the visibility of the color strips using conditional states.

Plugin Element Properties

Color Strip Small

Element properties → Color Strip Small.
Element properties → Color Strip Small.
Fields:
Title
Description
Type
Color1
Choose a Color
Color
Color2
Choose a Color
Color
Color3
Choose a Color
Color
Color4
Choose a Color
Color
Color5
Choose a Color
Color
Color6
Choose a Color
Color
Color7
Choose a Color
Color

Color Strip Small Medium

Element properties → Color Strip Small Medium.
Element properties → Color Strip Small Medium.
Fields:
Title
Description
Type
Color1
Choose a Color
Color
Color2
Choose a Color
Color
Color3
Choose a Color
Color
Color4
Choose a Color
Color
Color5
Choose a Color
Color
Color6
Choose a Color
Color
Color7
Choose a Color
Color

Color Strip Large

Element properties → Color Strip Large.
Element properties → Color Strip Large.
Fields:
Title
Description
Type
Color1
Choose a Color
Color
Color2
Choose a Color
Color
Color3
Choose a Color
Color
Color4
Choose a Color
Color
Color5
Choose a Color
Color
Color6
Choose a Color
Color
Color7
Choose a Color
Color
Image without caption

Changelogs