Загрузка...

How to Create a Liquid Glass Button in Figma – Step-by-Step Tutorial

In this tutorial, I’ll show you exactly how to create a beautiful Liquid Glass button effect in Figma. We’ll design a responsive button, add gradient strokes, apply blur and shadow effects, and customize it to look just like the Apple Liquid Glass style seen in their latest UI design.

💡 What you’ll learn:

- How to create responsive buttons in Figma
- How to apply gradient strokes and customize them
- How to use background blur and inner shadows for a glass effect
- Tips for layering, clipping, and reusing your button components

Follow along step by step and learn how to turn any button into a stunning, modern glass component inspired by Apple’s design language.

👉 Chapters and Timestamps.
0:00 – Intro
0:32 – Adding Gradient Stroke
0:58 – Applying Background Blur
1:20 – Adding Inner Shadows
2:40 – Ignore Auto Layout
3:11 – Creating the Liquid Effect
3:48 – Duplicating and Reusing the Button
4:30 – Final Touches and Tips
6:20 – Outro

💡 Don’t forget to subscribe for more Figma tutorials and UI design tips.

🛠 Created by ELEWAY — Elevate your way.

Видео How to Create a Liquid Glass Button in Figma – Step-by-Step Tutorial канала ELEWAY
Страницу в закладки Мои закладки
Все заметки Новая заметка Страницу в заметки

На информационно-развлекательном портале SALDA.WS применяются cookie-файлы. Нажимая кнопку Принять, вы подтверждаете свое согласие на их использование.

Об использовании CookiesПринять