Powered By GitBook
Bubble - Image Filters Plugin

Overview

This plugin allows you to add 7 different filters/modifications to your images. Filters include:
    Sepia
    Brightness
    Contrast
    Color
    Grayscale
    Saturation
    Blur
You can either apply the effect to existing image elements using an element action, or use the "Image with Filter" element to add an image with a filter directly.
For a demo of this plugin please visit: https://anticodeplugin.bubbleapps.io/imagefilter

Instructions

After installing this plugin you have access to two elements:
    Filter
    Go to Settings->General of your app and expose the option to add id attributes to html elements
    Drag the "Filter" element onto your page.
    Add an image to your page and enter an ID attribute in the element inspector of your image
    Trigger a filter effect within one of your workflows. You can choose one of the 7 filters and specify the strength of the effect. Enter the same element id that you used for the image you want to target in step 3.
    Image with Filter
    Drag the "Image with Filter" element onto your page. Upload an image or choose a dynamic image that should be used. Resize your element according to your requirements.
    Choose which filter should be applied using the dropdown in the element inspector.
    Specify the strength of the effect for the filter you choose. The values in the other field will be ignored.
Last modified 2yr ago
Copy link