Glassmorphism چیست؟ راهنمای کامل سبک گلس‌مورفیسم در طراحی سایت

در دنیای طراحی رابط کاربری، سبک‌های بصری مختلفی برای ایجاد هویت، عمق و تجربه‌ای متفاوت وجود دارند. یکی از شناخته‌شده‌ترین این سبک‌ها Glassmorphism یا گلس‌مورفیسم است؛ سبکی که با استفاده از شفافیت، تاری پس‌زمینه، لایه‌های نیمه‌شفاف و حاشیه‌های ظریف، ظاهر عناصر رابط کاربری را شبیه شیشه مات می‌کند.

اما Glassmorphism فقط یک افکت CSS نیست.

اگر درست استفاده شود، می‌تواند به ایجاد عمق بصری، سلسله‌مراتب، تفکیک لایه‌ها و تمرکز کاربر روی عناصر مهم کمک کند. اگر هم بدون توجه به خوانایی و تجربه کاربری استفاده شود، ممکن است سایتی زیبا اما گیج‌کننده و حتی کند ایجاد کند.

در این مقاله بررسی می‌کنیم Glassmorphism چیست، از کجا آمده، چه کسی این اصطلاح را رایج کرد، چه تفاوتی با Acrylic و Liquid Glass دارد، چگونه با CSS پیاده‌سازی می‌شود و در چه نوع سایت‌هایی استفاده از آن منطقی است.

⸻

Glassmorphism چیست؟

Glassmorphism یک سبک بصری در طراحی رابط کاربری است که معمولاً از چند ویژگی در کنار یکدیگر استفاده می‌کند:

* شفافیت
* Background Blur
* لایه‌های نیمه‌شفاف
* Borderهای ظریف
* Shadowهای نرم
* پس‌زمینه‌های رنگی یا گرادیانی
* ایجاد عمق بین لایه‌های مختلف

تصور کنید یک پنل شیشه‌ای مات را روی یک پس‌زمینه رنگی قرار داده‌اید.

محتوای پشت پنل کاملاً ناپدید نمی‌شود، بلکه از پشت آن دیده می‌شود و به دلیل Blur حالت نرم و مات پیدا می‌کند.

به همین دلیل ساختار ساده یک رابط Glassmorphism را می‌توان این‌طور تصور کرد:

Background
↓
Background Objects
↓
Blur + Transparency
↓
Glass Surface
↓
Content

این ترکیب باعث می‌شود عناصر صفحه روی سطوح مختلف قرار گرفته به نظر برسند.

⸻

چه کسی Glassmorphism را اختراع کرد؟

یکی از پرسش‌های جالب درباره Glassmorphism این است که چه کسی آن را اختراع کرده است.

پاسخ دقیق این است:

Glassmorphism توسط یک شخص اختراع نشده است.

افکت‌های شفاف، مات و شیشه‌ای سال‌ها قبل از به وجود آمدن اصطلاح Glassmorphism در رابط‌های کاربری استفاده می‌شدند.

اما Michal Malewicz، طراح و بنیان‌گذار Hype4، اصطلاح «Glassmorphism» را برای توصیف این سبک رایج کرد. او در سال ۲۰۲۱ توضیح داد که تقریباً یک سال قبل این نام را ابداع کرده و هدفش ایجاد یک نام مشترک برای افکتی بود که پیش از آن با نام‌هایی مانند Acrylic، Frosted Glass یا Glass Effect شناخته می‌شد. منبع: مقاله Michal Malewicz در Medium

بنابراین عبارت دقیق‌تر این است:

Michal Malewicz اصطلاح Glassmorphism را رایج کرد، اما خود زبان بصری شیشه‌ای سال‌ها قبل از آن وجود داشت.

این تفاوت تاریخی مهم است.

⸻

Glassmorphism از کجا آمده است؟

برای درک بهتر Glassmorphism باید بدانیم که ایده استفاده از شفافیت و لایه‌های بصری جدید نیست.

پیش از محبوب شدن اصطلاح Glassmorphism، سیستم‌عامل‌ها و زبان‌های طراحی مختلف از شفافیت، Blur و Materialهای نیمه‌شفاف استفاده می‌کردند.

یکی از نمونه‌های مهم، Acrylic در زبان طراحی Fluent مایکروسافت است.

مایکروسافت Acrylic را به‌عنوان یک Material نیمه‌شفاف معرفی می‌کند که از ویژگی‌هایی مانند شفافیت، Blur، Tint و Noise برای ایجاد عمق بصری استفاده می‌کند. برای مطالعه مستندات رسمی، می‌توانید به راهنمای Acrylic در Microsoft Fluent 2 مراجعه کنید.

بنابراین Glassmorphism را بهتر است بخشی از یک مسیر بزرگ‌تر در تکامل طراحی رابط کاربری بدانیم.

⸻

نقش Apple در محبوب شدن طراحی‌های شیشه‌ای

یکی از نقاط مهم در تاریخ طراحی رابط کاربری مدرن، طراحی macOS Big Sur بود.

اپل در این نسل از سیستم‌عامل خود از عناصر نیمه‌شفاف، لایه‌های بصری و عمق بیشتری در رابط استفاده کرد.

این موضوع باعث شد طراحی‌های شیشه‌ای و نیمه‌شفاف بیش از گذشته مورد توجه طراحان رابط کاربری قرار بگیرند.

البته نباید گفت:

Apple Glassmorphism را اختراع کرد.

این ادعا دقیق نیست.

بلکه می‌توان گفت Apple یکی از شرکت‌هایی بود که زبان‌های بصری مبتنی بر شفافیت و Materialهای لایه‌ای را در مقیاس بسیار بزرگ و در محصولات عمومی خود به کار گرفت.

⸻

Glassmorphism و Acrylic چه تفاوتی دارند؟

این دو مفهوم به هم نزدیک هستند اما یکی نیستند.

Glassmorphism بیشتر یک سبک بصری و مجموعه‌ای از اصول طراحی است.

Acrylic در اکوسیستم Microsoft Fluent یک Material مشخص با رفتار و قواعد طراحی خودش است.

به زبان ساده:

Glassmorphism می‌گوید رابط کاربری چه ظاهر و حسی داشته باشد.

Acrylic بخشی از یک Design System مشخص است که Material و نحوه استفاده از آن را تعریف می‌کند.

این تفاوت در طراحی سیستماتیک بسیار مهم است.

⸻

Glassmorphism و Liquid Glass چه تفاوتی دارند؟

در سال‌های اخیر اصطلاح دیگری نیز بسیار مورد توجه قرار گرفته است:

Liquid Glass

اپل در سال ۲۰۲۵ زبان بصری جدید خود را با Materialی به نام Liquid Glass معرفی کرد. Apple توضیح می‌دهد که این Material نیمه‌شفاف است و می‌تواند محیط اطراف خود را به شکل پویا منعکس و منکسر کند و بسته به محتوا و زمینه تغییر کند. این طراحی در iOS 26، iPadOS 26، macOS Tahoe 26، watchOS 26 و tvOS 26 به کار گرفته شده است. برای مطالعه معرفی رسمی این فناوری، به خبر رسمی Apple درباره Liquid Glass مراجعه کنید.

بنابراین Liquid Glass را نباید صرفاً نام جدید Glassmorphism بدانیم.

Glassmorphism معمولاً بر مواردی مانند:

* Transparency
* Blur
* Glass Surface
* Layering

تمرکز دارد.

در حالی که Liquid Glass در اکوسیستم Apple رفتار بسیار پویاتری دارد و از Rendering، Refraction، تغییرات نوری و واکنش به محیط استفاده می‌کند. Apple در مستندات توسعه‌دهندگان خود نیز به تغییر پویا در Tint، Shadow، Dynamic Range و Refraction اشاره می‌کند. جزئیات فنی این موضوع در ویدیوی رسمی WWDC درباره طراحی Liquid Glass قابل مشاهده است.

⸻

اجزای اصلی Glassmorphism

برای ساخت یک رابط Glassmorphism معمولاً چند ویژگی با یکدیگر ترکیب می‌شوند.

۱. Transparency

سطح شیشه‌ای نباید کاملاً مات باشد.

برای مثال:

background: rgba(255, 255, 255, 0.12);

این مقدار باعث می‌شود بخشی از Background از پشت عنصر دیده شود.

⸻

۲. Background Blur

یکی از مهم‌ترین ویژگی‌ها:

backdrop-filter: blur(20px);
-webkit-backdrop-filter: blur(20px);

این ویژگی محتوای پشت عنصر را نرم و مات می‌کند.

⸻

۳. Border ظریف

یک Border بسیار کم‌رنگ می‌تواند مرز پنل را مشخص کند:

border: 1px solid rgba(255, 255, 255, 0.2);

⸻

۴. Shadow

Shadow به جدا شدن پنل از Background کمک می‌کند:

box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2);

⸻

۵. Background مناسب

Glassmorphism روی Background کاملاً ساده معمولاً جذابیت زیادی ندارد.

به همین دلیل معمولاً از:

* Gradient
* Mesh Gradient
* Aurora
* Blob
* تصاویر
* نورهای رنگی
* اشکال انتزاعی

استفاده می‌شود.

⸻

یک نمونه ساده از Glass Card با CSS

یک کارت ساده می‌تواند چنین ساختاری داشته باشد:

.glass-card {
background: rgba(255, 255, 255, 0.12);
backdrop-filter: blur(20px);
-webkit-backdrop-filter: blur(20px);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 24px;
box-shadow:
0 20px 60px rgba(0, 0, 0, 0.2);
}

اما یک نکته بسیار مهم وجود دارد:

چند خط CSS به‌تنهایی یک طراحی Glassmorphism خوب نمی‌سازند.

کیفیت نهایی به مواردی مانند:

* انتخاب Background
* میزان شفافیت
* شدت Blur
* Contrast
* Typography
* فاصله‌گذاری
* Shadow
* تعداد لایه‌ها

وابسته است.

⸻

چرا Glassmorphism جذاب است؟

مهم‌ترین دلیل جذابیت این سبک، ایجاد Depth یا عمق بصری است.

در طراحی Flat، عناصر معمولاً روی یک سطح ساده قرار دارند.

اما در Glassmorphism می‌توان چند سطح ایجاد کرد:

Background
↓
Background Elements
↓
Glass Layer
↓
Secondary Glass Layer
↓
Content

این لایه‌بندی باعث می‌شود کاربر بتواند تفاوت بین بخش‌های مختلف رابط را سریع‌تر تشخیص دهد.

⸻

Glassmorphism برای چه بخش‌هایی از سایت مناسب است؟

این سبک را می‌توان در بخش‌های مختلف استفاده کرد.

Navbar

یک Navigation شیشه‌ای روی Background می‌تواند ظاهر بسیار مدرنی ایجاد کند.

Hero

می‌توان یک Glass Panel را روی تصویر، Gradient یا Background سه‌بعدی قرار داد.

Card

برای کارت‌های:

* خدمات
* ویژگی‌ها
* محصولات
* پروفایل
* قیمت‌گذاری

قابل استفاده است.

Modal

پنجره‌های Modal با Glassmorphism می‌توانند حس لایه‌ای مناسبی ایجاد کنند.

Dashboard

در Dashboardهای مدرن و Futuristic نیز می‌توان از این سبک استفاده کرد.

CTA

یک CTA شیشه‌ای روی Background پررنگ می‌تواند توجه کاربر را جلب کند.

⸻

چه زمانی نباید از Glassmorphism استفاده کنیم؟

Glassmorphism برای همه سایت‌ها و همه بخش‌های یک سایت مناسب نیست.

اگر Background بسیار شلوغ باشد، خوانایی متن کاهش پیدا می‌کند.

همچنین اگر همه عناصر صفحه شیشه‌ای باشند، دیگر سلسله‌مراتب بصری مناسبی وجود نخواهد داشت.

برای مثال:

Glass Navbar
Glass Hero
Glass Cards
Glass Buttons
Glass Footer
Glass Modal

استفاده همزمان و افراطی از همه این موارد می‌تواند سایت را شلوغ کند.

یک قانون ساده:

Glass باید برای ایجاد سلسله‌مراتب استفاده شود، نه اینکه همه چیز را شیشه‌ای کنیم.

⸻

مهم‌ترین مشکل Glassmorphism؛ خوانایی

یکی از چالش‌های جدی این سبک، Accessibility و خوانایی متن است.

اگر Background پشت پنل تغییرات زیادی داشته باشد، Contrast متن نیز ممکن است تغییر کند.

برای جلوگیری از این مشکل باید به موارد زیر توجه کرد:

* Contrast مناسب
* Blur کافی
* Overlay مناسب
* رنگ مناسب متن
* Border قابل تشخیص
* اندازه مناسب فونت

برای بررسی استانداردهای کنتراست، می‌توانید به راهنمای رسمی WCAG درباره حداقل کنتراست متن مراجعه کنید.

ظاهر زیبا نباید باعث شود کاربر برای خواندن محتوا مجبور به تلاش بیشتری شود.

⸻

Glassmorphism و Performance

استفاده از Blur و backdrop-filter در تعداد زیاد می‌تواند هزینه رندر بیشتری ایجاد کند.

اگر یک صفحه ده‌ها عنصر شیشه‌ای با Blur شدید داشته باشد، مخصوصاً در دستگاه‌های ضعیف‌تر یا موبایل، ممکن است عملکرد سایت تحت تأثیر قرار گیرد.

برای همین بهتر است:

* تعداد Glass Layerها محدود باشد
* Blur بیش از حد استفاده نشود
* تصاویر Background بهینه باشند
* Animationهای سنگین کنترل شوند
* نسخه موبایل به‌صورت واقعی تست شود

برای بررسی پشتیبانی مرورگرها از backdrop-filter می‌توانید به مستندات MDN درباره backdrop-filter مراجعه کنید.

یک طراحی خوب فقط زیبا نیست؛ باید سریع و قابل استفاده هم باشد.

⸻

Glassmorphism در طراحی سایت مدرن

در طراحی مدرن، بهتر است Glassmorphism را به‌عنوان یک ابزار ببینیم، نه قانون طراحی.

مثلاً یک سایت می‌تواند:

* Background ساده داشته باشد
* فقط Navbar شیشه‌ای باشد
* دو یا سه Card شیشه‌ای داشته باشد
* CTA اصلی Solid باشد
* متن‌ها روی Surface خوانا قرار بگیرند

این روش معمولاً بهتر از آن است که تمام صفحه با Blur و Transparency پوشانده شود.

⸻

Glassmorphism برای سایت شرکتی

برای سایت‌های شرکتی می‌توان از Glassmorphism در قسمت‌های خاص استفاده کرد.

مثلاً:

* Navbar
* Hero Card
* Feature Cards
* CTA
* Modal

اما بخش‌های متنی طولانی بهتر است روی Surfaceهایی با خوانایی بالا قرار بگیرند.

اگر قصد طراحی یک سایت شرکتی یا اختصاصی دارید، می‌توانید خدمات طراحی وب‌سایت اختصاصی نونونیک را بررسی کنید؛ این صفحه در کنار طراحی سایت، خدمات UI/UX، پنل مدیریت اختصاصی و سئو را نیز معرفی می‌کند.

⸻

Glassmorphism برای سایت شخصی

یکی از کاربردهای جذاب Glassmorphism در سایت‌های شخصی طراحان، توسعه‌دهندگان و افراد فعال در حوزه‌های خلاقانه است.

ترکیب:

* Gradient
* Glass Card
* Motion
* 3D
* Typography
* عناصر شناور

می‌تواند یک هویت بصری متفاوت ایجاد کند.

در این نوع پروژه‌ها معمولاً هدف فقط نمایش اطلاعات نیست؛ بلکه خود رابط کاربری بخشی از شخصیت برند فرد است.

⸻

Glassmorphism برای سایت فروشگاهی

در فروشگاه اینترنتی باید با احتیاط بیشتری از این سبک استفاده کرد.

صفحه فروشگاهی معمولاً اطلاعات زیادی دارد:

* محصول
* قیمت
* تخفیف
* دکمه خرید
* فیلتر
* ویژگی‌ها
* موجودی

اگر همه این عناصر شیشه‌ای شوند، خوانایی و تمرکز کاربر کاهش پیدا می‌کند.

در فروشگاه‌ها بهتر است Glass برای بخش‌هایی مانند:

* Header
* Filter
* Modal
* Featured Product
* Banner

استفاده شود.

⸻

نمونه واقعی؛ Glassmorphism در کنار طراحی مدرن

یکی از نکات مهم در مطالعه این سبک، بررسی نمونه‌های واقعی است.

بهتر است به جای اینکه فقط Dribbble یا تصاویر مفهومی را ببینیم، وب‌سایت‌هایی را بررسی کنیم که این سبک را در یک تجربه واقعی به کار گرفته‌اند.

برای مشاهده پروژه‌های واقعی طراحی‌شده توسط نونونیک نیز می‌توانید وارد صفحه نمونه‌کارهای نونونیک شوید. در این صفحه پروژه‌هایی مانند سایت آرایشگاه مردانه، سایت باشگاه بدنسازی، کلینیک زیبایی، املاک، رستوران و فروشگاه طلا قرار گرفته‌اند.

⸻

Glassmorphism و طراحی سایت آرایشگاه مردانه

یکی از حوزه‌هایی که این سبک می‌تواند جذاب باشد، سایت‌های برندمحور مانند آرایشگاه‌های مردانه است.

برای مثال می‌توان:

* Navbar شیشه‌ای
* کارت خدمات شیشه‌ای
* Pricing Card
* Hero با Gradient
* Gallery با Overlay
* CTA شیشه‌ای

ساخت.

در نمونه‌کار Barber House نونونیک نیز از طراحی Dark، ترکیب مشکی و طلایی، گالری، معرفی خدمات و ساختار مناسب رزرو استفاده شده است.

می‌توانید این پروژه را در نمونه‌کار طراحی سایت آرایشگاه مردانه Barber House مشاهده کنید.

⸻

تفاوت Glassmorphism و Neumorphism

این دو سبک گاهی با یکدیگر اشتباه گرفته می‌شوند.

Glassmorphism

تمرکز روی:

Transparency + Blur + Layering

Neumorphism

تمرکز روی:

Soft Shadows + Light/Dark Surfaces + Extrusion

به زبان ساده:

Glassmorphism می‌خواهد حس شیشه و لایه شفاف ایجاد کند.

Neumorphism می‌خواهد حس برآمدگی یا فرورفتگی یک سطح را ایجاد کند.

بنابراین حتی اگر هر دو سبک مدرن به نظر برسند، منطق بصری آن‌ها متفاوت است.

⸻

Glassmorphism در برابر Liquid Glass

در سال‌های اخیر استفاده از Materialهای شفاف و پویا وارد مرحله جدیدی شده است.

Apple در سال ۲۰۲۵ Liquid Glass را معرفی کرد؛ Materialی که طبق توضیحات رسمی این شرکت می‌تواند محیط اطراف خود را بازتاب و منکسر کند و با محتوا و زمینه به‌صورت پویا تغییر کند. برای مطالعه جزئیات، به معرفی رسمی Liquid Glass در وب‌سایت Apple مراجعه کنید.

پس می‌توان این تفاوت ساده را در نظر گرفت:

ویژگی Glassmorphism Liquid Glass
ماهیت سبک بصری Material / Design Language
Transparency دارد دارد
Blur بسیار رایج بخشی از رفتار Material
Refraction معمولاً محدود عنصر مهم
رفتار پویا معمولاً کم بسیار بیشتر
کاربرد Web UI و محصولات مختلف اکوسیستم Apple

این تفاوت به‌خصوص برای طراحانی که می‌خواهند در سال ۲۰۲۶ طراحی‌های شیشه‌ای ایجاد کنند اهمیت دارد.

⸻

آیا Glassmorphism هنوز ارزش استفاده دارد؟

بله؛ اما نه به‌عنوان یک Trend که باید همه‌جا تکرار شود.

ارزش اصلی Glassmorphism زمانی مشخص می‌شود که به حل یک مسئله طراحی کمک کند.

مثلاً:

* ایجاد عمق
* جدا کردن Navigation
* برجسته کردن CTA
* ایجاد Focus
* تفکیک لایه‌ها
* ساخت هویت بصری

اگر فقط به دلیل «زیبا بودن» استفاده شود، ممکن است نتیجه خوبی نداشته باشد.

⸻

اشتباهات رایج در طراحی Glassmorphism

استفاده بیش از حد از Blur

Blur زیاد باعث کاهش خوانایی و افزایش هزینه رندر می‌شود.

شفافیت بیش از حد

اگر کارت بیش از حد شفاف باشد، مرز آن با Background مشخص نیست.

استفاده از Background شلوغ

Background پیچیده می‌تواند متن را غیرقابل خواندن کند.

Glass کردن همه چیز

وقتی همه عناصر شیشه‌ای باشند، هیچ عنصر مهمی برجسته نمی‌شود.

بی‌توجهی به موبایل

افکت‌هایی که روی دسکتاپ زیبا هستند ممکن است روی موبایل تجربه ضعیفی ایجاد کنند.

بی‌توجهی به Accessibility

کنتراست متن باید قبل از انتشار بررسی شود.

⸻

چک‌لیست طراحی سایت با Glassmorphism

قبل از انتشار یک سایت Glassmorphism بهتر است این موارد بررسی شوند:

* [ ] Background مناسب انتخاب شده است.
* [ ] میزان شفافیت کنترل شده است.
* [ ] Blur بیش از حد نیست.
* [ ] متن خوانایی کافی دارد.
* [ ] Contrast مناسب است.
* [ ] Border به‌اندازه کافی قابل تشخیص است.
* [ ] Shadow بیش از حد سنگین نیست.
* [ ] تمام عناصر صفحه Glass نشده‌اند.
* [ ] نسخه موبایل بررسی شده است.
* [ ] Performance تست شده است.
* [ ] Animationها کنترل شده‌اند.
* [ ] Glass به ایجاد Hierarchy کمک می‌کند.
* [ ] CTA اصلی به اندازه کافی واضح است.

⸻

Glassmorphism چه آینده‌ای دارد؟

سبک‌های طراحی وب ثابت نمی‌مانند.

Glassmorphism بخشی از یک روند بزرگ‌تر در طراحی رابط کاربری است؛ روندی که در آن Materialها از یک سطح ساده فراتر می‌روند و با نور، عمق، حرکت و محتوای اطراف ارتباط بیشتری پیدا می‌کنند.

ظهور Liquid Glass در محصولات Apple نمونه‌ای از همین حرکت به سمت Materialهای پویا و واکنش‌پذیر است. Apple این Material را به‌عنوان پایه طراحی جدید خود در چندین سیستم‌عامل معرفی کرده است. برای مطالعه منبع اصلی، به خبر رسمی Apple درباره معرفی Liquid Glass مراجعه کنید.

بنابراین احتمالاً در سال‌های آینده شاهد ترکیب بیشتری از:

* Glass
* 3D
* Motion
* Lighting
* Depth
* Refraction
* AI-generated interfaces

خواهیم بود.

⸻

جمع‌بندی

Glassmorphism یکی از جذاب‌ترین سبک‌های طراحی رابط کاربری مدرن است؛ اما نباید آن را فقط به چند خط CSS و backdrop-filter محدود کرد.

این سبک زمانی موفق است که بتواند:

عمق ایجاد کند،

لایه‌ها را از یکدیگر جدا کند،

عناصر مهم را برجسته کند،

و در عین حال خوانایی و سرعت سایت را حفظ کند.

از نظر تاریخی نیز بهتر است بدانیم که Glassmorphism یک اختراع ناگهانی توسط یک فرد نیست. افکت‌های شفاف و شیشه‌ای سال‌ها قبل وجود داشتند و Michal Malewicz اصطلاح Glassmorphism را برای این سبک رایج کرد. برای مطالعه توضیحات او، به مقاله اصلی Glassmorphism در Medium مراجعه کنید.

در سال‌های اخیر نیز با معرفی Liquid Glass توسط Apple، مفهوم Materialهای شفاف و پویا وارد مرحله جدیدی شده است. جزئیات این معرفی در منبع رسمی Apple درباره Liquid Glass منتشر شده است.

در نهایت، مهم‌ترین اصل این است:

Glass را برای ایجاد تجربه بهتر استفاده کنید، نه فقط برای زیباتر کردن تصویر.

⸻

مطالب مرتبط در نونونیک

اگر به طراحی رابط کاربری، توسعه سایت و ساختار فنی وب علاقه دارید، می‌توانید مطالب مرتبط نونونیک را نیز دنبال کنید:

خدمات طراحی سایت و UI/UX نونونیک

نمونه‌کارهای طراحی سایت نونونیک

مقالات نونونیک

و برای شروع یک پروژه طراحی سایت:

درخواست مشاوره و شروع پروژه با نونونیک

این مقاله اولین بخش از مجموعه «سبک‌های طراحی سایت» است؛ در ادامه می‌توان سبک‌هایی مانند Minimalism، Futuristic، 3D، Brutalism، Neumorphism، Flat Design، Cyberpunk، Retro، Editorial، Swiss، Bento Grid و … را به‌صورت تخصصی بررسی کرد.