Hi, guys I found that CSS can create glassmorphism, which is cool, as you can set up everything from exact color to opacity, size, outline. And I assume + performant and less work than loading Figma or any tool to create just a rectangle in glassmorphism until itās right. Especially if you have no skills whatsoever as graphist/designer.
Thus said ā¦
Can I achieve this?
This is a simulation with hint component (which I love it really looks like glassmorphism already) and spaces.
My idea is to design a glassmorph door that covers almost the whole background over a background image (OK) and a black background (OK), with an impression the contour is glowing (well, like a door at night, with the light on to show there must be indoor āpresenceā. Or a magic box).
I found this
THIS IS THE RESULT I WANT for the door (opacity, blur, color)
And my capture below simulating sth close (yeah, not sure the Indiana Jones hat can manage to go over the door) from the default hint component (so no opacity, no blur, no custom color) to give you an idea of how it covers the screen.
I know this is Madness, but there must be Method in it (From a crazy Brit guy called William S.)
What say you?
Doable? Waste of Time?
Thks anyway
Glassmorphism with CSS. I have never heard of this, itās fun!
For experimental purposes and to push the current limits of Glide: why not use CSS and experiment as much as possible! Whatās being done in Glide with css is impressive.
To build an app for work that brings tremendous value to a business: I think CSS might be unnecessary and it might even become a distraction to the builder more than anything.
Thks, ThinhDinh .
I want anything that displays like a rectangle
that covers almost full screen
in glassmorphism
with configurable color, size, blur, opacity, border color
bonus: glowing
in background
It does not matter whether itās a hack of a hint, a button, any object.
I donāt know if No Code are supposed to allow various shapes to customize UI/UX, but it would open many possibilities.
If not, Iāll have to create a background image, which is the hard way, less smart, less flexible, longer to load?
Thks, Lucas
Yes, Please! @Pedroydzito
From my educated guess, maybe you can only hack with CSS only existing objects like components, not to introduce a shape like a rectangle out of nowhere.
So maybe it can be a hack of the hint, the button component that can be in the background and accept many or all of the CSS.
Maybe we have to use an image after all. But maybe it could be just a tiny blank image to get css sth to target?
Anyway, enjoy!
Thks, Pedro!
May all the Muses amuse you!
Should you come up with sth else, please let us know.
I wish you the best tests.
If itās a no go, well, so be it
Bonne chance! Good Luck!
Whohoho! The whole thread looks very promising, indeed.
Iāve copied the @Jeff_Hager + @Manu.n + You @Robert_Petitto CSS and I already got a box as bcg. There should be nothing to stop me from getting what I want. Even the border, the radius, the bonus shadow, and who knows, the glowing? Merci, Robert ! (and all the guys in the topic).
Canāt wait to work on this.
On 1st try, my floating button completely disappears. Ouch that hurts! I hope itās not incompatible.
Oh LOL, @Darren_Alderman, so you have to hard code the floating to help it float above the crowd?
How Funny!
Itās like telling so what s.heās expected to do when itās in his/her job description!
Thks!
Ach, too bad I canāt work on it now
Argh, the video is too cropped, you donāt see the light under the door!
You have to move you mouse on the video to unhide the bottom.
The video quality is not so good in Loom. Can I enhance it?
I found that CSS can create glassmorphism, which is cool, as you can set up everything from exact color to opacity, size, outline. And I assume + performant and less work than loading Figma or any tool to create just a rectangle in glassmorphism until itās right. Especially if you have no skills whatsoever as graphist/designer.
ā¦
(From a crazy Brit guy called William S.)
.
Merci, Robert ! (and all the guys in the topic).
Thank U! Lucky me to have you all!