Mix-blend-mode: режимы наложения/смешивания на Тильде

Всем привет😘👋 Не забываем ставить 👍 и подписываемся на канал 🛎 — впереди много интересного🔥🥳 С вами — Наталья Чистякова, UX/UI Веб-дизайнер, в этом видео расскажу о том, как применять любимые и известные по Фигме режимы наложения mix-blend-mode в вёрстке на Тильде🔥 🧠Для справки: mix-blend-mode — понятие из области CSS — Cascading Style Sheets; это CSS-свойство, которое определяет, как ваш элемент (его содержимое) будет сочетаться с фоном, на котором располагается (если в двух словах) — понятно, что это всё можно очень эффектно применять на сайтах, особенно по скроллу с фиксацией, по ховеру на изображениях и т. д.🔥 🦊Желающим задонатить за полезную инфу — к боту-помощнику 👉 ⏱Тайминг — для вашего удобства❤️: 00:00 — вступление и краткий анонс следующих видео💋 02:18 — mix-blend-mode — что это и как может выглядеть 05:17 — mix-blend-mode как CSS-свойство → источники на MDN 06:09 — mix-blend-mode как режимы наложения в Фигме 09:27 — «фильтры», режимы наложения/смешивания в Фигме — как применять в Тильде? 09:43 — краткий обзор блока Аннекс ANX822 по режимам и фильтрам 10:26 — CSS-код для mix-blend-mode, если нет подписки на Аннекс или просто в кайф написать пару строчек самому (самой)🔥 12:37 — как использовать mix-blend-mode по ховеру🖐 13:50 — CSS-код для mix-blend-mode по ховеру👆 15:09 — mix-blend-mode на фото — как выглядит, как можно миксовать и где использовать 💅Cобственно, сами режимы наложения (хорошо вам знакомые, как минимум, если не по CSS, то по Фигме) — код для применения эффекта смотрите по таймингу🥰 (Ютуб не даёт поставить угловые скобки, и код получается не всем понятным): mix-blend-mode: normal; mix-blend-mode: multiply; mix-blend-mode: screen; mix-blend-mode: overlay; mix-blend-mode: darken; mix-blend-mode: lighten; mix-blend-mode: color-dodge; mix-blend-mode: color-burn; mix-blend-mode: hard-light; mix-blend-mode: soft-light; mix-blend-mode: difference; mix-blend-mode: exclusion; mix-blend-mode: hue; mix-blend-mode: saturation; mix-blend-mode: color; mix-blend-mode: luminosity; mix-blend-mode: plus-darker; mix-blend-mode: plus-lighter; ✔️Полезные ссылки: 📌 Подробнее по mix-blend-mode и обо всех режимах, что и как сочетается и выглядит👉 📌 Захотели углубиться😘? Читайте и про BACKGROUND-blend-mode🙌👉 📹Хочешь предложить свою тему для видео или давай соберём эфир вместе — пиши в ТГ (никнейм: @chistyakova_website) или в комментах к этому видео🔥 🫦Ещё раз напоминаю о том, что это и другие полезные видео выкладываю, в том числе, в рамках нашего дизайнерского душевного чата, в котором являюсь Админом — чат Pro.дизайн 👉 👋Вливайтесь для человеческого и профессионального общения, а также на случай, если давно хотели закинуть какую-нибудь интересную тему, но не решались😁 — мы периодически проводим эфиры, так что у вас есть реальный шанс стать приглашённым спикером-экспертом и поделиться своими знаниями, инсайтами и компетенциями с грамотной интеллигентной и просто клёвой аудиторией🔥✨☺️, а потом взять и выложить запись своего бенефиса в соцсетях😉 — отличный инфоповод💪 Если есть вопросы ко мне: ► дизайн; ► типографика и композиция на сайте; ► анимация любого сценария и уровня сложности; ► подбор креативных идей; ► оформление документов для сайта (Политика конфиденциальности, Публичная оферта, РКН, согласие субъекта ПД); ► оформление отношений с заказчиками, разрешение спорных ситуаций, составление актов и претензий); ► любой вопрос за рамками поименованных — мои компетенции гораздо шире заявленных😉, — пишите в ЛС, разберёмся в любой ситуации🤝 Чат Pro.дизайн 👉 Сообщество в ВК🥰👉 Мой ТГ — ВК — Инст (продукт Meta, в РФ признана экстремистской организацией) — / DProfile — Приятного просмотра👀🔥 #mixblendmode #css #tilda #наложение