https://misosos.github.io/en/tags/design/DesignHugo Blox Builder (https://hugoblox.com)en-usWed, 08 Oct 2025 00:00:00 +0000https://misosos.github.io/media/sharing.pnghttps://misosos.github.io/en/tags/design/https://misosos.github.io/en/playground/frontend-playground/glassmorphism-test/Wed, 08 Oct 2025 00:00:00 +0000https://misosos.github.io/en/playground/frontend-playground/glassmorphism-test/<p>I was curious about how the latest UI trend, Glassmorphism, is implemented, so I experimented with creating it using only TailwindCSS.</p> <p>Instead of writing separate CSS code, I combined TailwindCSS utility classes such as <code>backdrop-filter</code> and <code>blur</code>, observing the visual changes in real time. By slightly adjusting the transparency and border thickness, I explored how to achieve the most natural glass-like depth that seems to float above the background.</p> <p>I also added a simple hover animation to test how the design would feel when interactivity is introduced. Through this small experiment, I once again confirmed that even complex-looking UI designs can be built quickly and intuitively using only utility-based approaches.</p>