GlassMorphism
Applies the Glass Morphism effect inside the Arrangement.
arrangement: HVArrangement to which the effect will be applied.
Sets the corner radius in pixels.
radius: Corner radius in pixels.
Sets the blur amount for the background filter in pixels.
blur: Blur amount in pixels.
Sets the border color. Example: 'rgba(255, 255, 255, 0.3)'.
color: The border color in rgba format.
Border width.
width: Border width in pixels.
Sets the background color. Example: 'rgba(255, 255, 255, 0.2)'.
color: The background color in rgba format.
Extension:joejsanz.joedevglassmorphism.aix (6.9 KB)
Thanks.
8 Likes
TIMAI2
December 26, 2024, 11:40pm
2
Well done Joe. An update on what I had to do to achieve the same effect...
Make a blurred semi transparent image, and apply it to your component. There may be extensions that enhance arrangements that can help with the appearance.
1 Like
Thanks a lot Tim
Yes I saw it, it is more complicated but it is a very good result, I liked your work and what you used to achieve it.
What I did was use a web viewer built into an arrangement for more control with customization and embed html and css in that web viewer.
1 Like
minjea
June 25, 2025, 1:22am
4
Other than function activation, other additional settings are not working (e.g., edge, amount of blur, height, etc.)
Peter
June 25, 2025, 2:51am
5
Show what you did and what the result was.
minjea:
not working
Try this project and tell me if it works for you.
GlassMorphismTest.aia (1.6 MB)
minjea
June 25, 2025, 6:35am
7
It works well with the project you sent me. I simply set it like that, like the picture. I don't think I know how to use it. It doesn't work because the project you gave me did the way I set it.
minjea:
It doesn't work
You need to put the ApplyGlassMorphism function at the bottom
1 Like
minjea
June 25, 2025, 6:46am
9
I just noticed that it is a difference in order as I tested it. I solved it. Thank you for your help.
1 Like
