КодВеб | Дизайн База

👩‍💻 AMEGA Сайт фермерского проекта 🟠 Сложность: Средний 🟠 Адаптивность: Есть 🎨 Дизайн База. Подписаться #Макеты #Figma

👨‍💻 BENTO Оформление для спортивного или сайта иной тематики 🎨 Дизайн База. Подписаться #Codepen #CSS

👩‍💻 F.Palace Сайт ресторана 🟠 Сложность: Легкий 🟠 Адаптивность: Нет 🎨 Дизайн База. Подписаться #Figma

👨‍💻 Encrypted Password Reveal Окно для ввода пароля с возможностью скрытия 🎨 Дизайн База. Подписаться #Codepen #CSS

👩‍💻 Delivery Trans Сайт компании грузоперевозок 🟠 Сложность: Средний 🟠 Адаптивность: Есть 🎨 Дизайн База. Подписаться #Макеты #Figma

👨‍💻 Adjustable Text Emphasis with CSS Регулируемый градиентный текст 🎨 Дизайн База. Подписаться #Codepen #CSS

❔ Как оформить split-кнопки? HTML:

<button class="btn">  
<span class="text">В корзину</span> 
</button>

CSS:

.btn {
   position: relative;
   padding: 15px 30px;
   margin: 0 20px;
   font-family: 'Montserrat Alternates', sans-serif;
   color: white;
   font-weight: 600;
   background: #c81965;
   border-width: 0;
   outline: none;
   cursor: pointer;
}
.btn:before, .btn:after {
   content: "";
   position: absolute;
   height: 50%;
   width: 100%;
   background: #c81965;
   transition: .3s cubic-bezier(.75, .24, .01, .9);
}
.btn:before {
   top: 0;
   right: -5px;
}
.btn:after {
   bottom: 0;
   left: -5px;
}
.btn:hover:before {
   transform: translateX(-5px);
}
.btn:hover:after {
   transform: translateX(5px);
}
.btn2, .btn2:before, .btn2:after {
   background: #1f0b2f;
}
.text {
   position: relative;
   z-index: 2;
}

🎨 Дизайн База. Подписаться #Разбор #HTML #CSS

👩‍💻 TOY STREAM Компания по разработке игр 🟠 Сложность: Сложный 🟠 Адаптивность: Есть 🎨 Дизайн База. Подписаться #Figma

⚡️ В сети начали массово сливать курсы и книги известных онлайн школ Вот отсортированная база с тонной материала(постепенно пополняется): БАЗА (4687 видео/книг): (363 видео, 87 книги) — Python (415 видео, 68 книги) — Frontend (143 видео, 33 книги) — ИБ/Хакинг (352 видео, 89 книги) — С/С++ (343 видео, 87 книги) — Java (176 видео, 32 книги) — Git (293 видео, 63 книги) — C# (174 видео, 91 книги) — DevOps (167 видео, 53 книги) — PHP (227 видео, 83 книги) — SQL/БД (163 видео, 29 книги) — Linux (107 видео, 43 книги) — СисАналз (181 видео, 32 книги) — Go (167 видео, 43 книги) — Kotlin/Swift (112 видео, 24 книги) — Flutter (137 видео, 93 книги) — DS/ML (113 видео, 82 книги) — GameDev (183 видео, 37 книги) — UI/UX (129 видео, 73 книги) — QA (213 видео, 63 книги) — Rust (121 видео, 24 книги) — Ruby Скачивать ничего не нужно — все выложили в Telegram

📺 Redshift render в Cinema 4D Быстрый разбор рендера в Cinema 4D с помощью Redshift, не больше и не меньше 🤷‍♂️ 🎨 Дизайн База. Подписаться #Разбор #Cinema4D

Дед Мороз в беде: надо выяснить, что загадали сотрудники компаний на Новый год, и поучаствовать в розыгрыше. Приз: курсы от онлайн-лектория Синхронизация 🎁 Переходите по ссылке, чтобы начать игру

📺 Шрифт и иллюстрация Этот гайд ответит на вопрос: «Как поставить рядом шрифт и иллюстрацию, чтобы они хорошо работали вместе? Как искать и выбирать шрифты иллюстратору?» 🎨 Дизайн База. Подписаться #Разбор

🤔 Как быть 3D Артисту в 2020-х годах?

Хочу внести вклад в развитие сообщества и всех 3д художников, которые начинают свой путь без всякого арт-бэкграунда и какого-либо другого опыта, как когда-то я. А также помочь тем, кто встрял на первых двух лестницах карьеры и не понимает, что и как дальше делать. Хочется, чтобы люди больше испытывали радость от жизни и процессов на работе так же, как и я. Разберем, что необходимо начинающему 3д артисту в наше время для устройства на работу.

🎨 Дизайн База. Подписаться #Разбор

🎨 Вышел Lottielab 1.0 "Фигма для анимаций" обновилась до версии 1.0 и выкатила видеопрезентацию своего продукта. Всё красиво и плавно, как мы это любим. Главный вопрос — бесплатно? Да, но добавляется небольшой вотермарк на анимацию, который легко обрезать. Специально зашёл, чтобы проверить, как это выглядит, результат в посте. В общем, штука годная, советую 👍 🎨 Дизайн База. Подписаться #Сервис #Lottielab

👩‍💻 Mountain Сайт туристического агентства 🟠 Сложность: Легкий 🟠 Адаптивность: Нет 🎨 Дизайн База. Подписаться #Codepen

🎨 Vector Image AI — бесплатный генератор SVG-изображений на основе ИИ Ключевые особенности:

🧠 Искусственный интеллект для творчества: Генерируйте уникальные SVG-иллюстрации и иконки всего за пару слов. 🎯 Четкая, масштабируемая векторная графика: Подходит для любого размера экрана и разрешения. 🚀 Экономия времени: Забудьте о ручной работе и сосредоточьтесь на главном. 🔄 Бесшовная интеграция с Figma: Создавайте и используйте графику прямо в ваших проектах. 🌈 Универсальность для любых задач: Идеально для UI/UX, брендинга, презентаций и многого другого.

🎨 Дизайн База. Подписаться #Плагин #Figma #ИИ

👩‍💻 Как Apple добилась таких анимаций? Учимся у лучших — в этом видео автор разбирает, как Apple добилась известных всему миру плавных и "натуральных" анимаций, которые другие до сих пор лишь копируют. Полезно знать для общего развития 😊 🎨 Дизайн База. Подписаться #Разбор #UXUI

Dev Fonts — крупная библиотека шрифтов для программиста. Если хотите, чтобы ваш код красиво выглядел, бегом сюда: на этом сайте собраны лучшие шрифты для ваших консолей и IDE. Под оформление можно выбрать тему и язык прогарммирования, чтобы посмотреть, как будет выглядеть шрифт ещё до скачивания. А ещё шрифты можно сравнивать между собой прямо на сайте. 🎨 Дизайн База. Подписаться #Сервис

❔ Как оформить картинку с тенью и рамкой? HTML:

<div class="shadow-border">
  <img src="image.jpg">
</div>

CSS:

*, *:after {box-sizing: border-box;}
.shadow-border {
  width: 400px;
  margin: 50px auto 0;
  position: relative;
}
 .shadow-border:after {
  content:"";
  width: 100%;
  height: calc(100% - 20px);
  position: absolute;
  top: 10px;
  left: 25px;
  z-index: 1;
  border: 5px solid #FF9B6C;
}
.shadow-border img {
  max-width: 100%;
  height: auto;
  display: block;
  position: relative;
  z-index: 2;
  box-shadow: 4px 4px 20px 0 rgba(0,0,0,.25)
}

🎨 Дизайн База. Подписаться #Гайды #HTML #CSS

🎨 Metaball — плагин для плавного объединения эллипсов Крутой плагин на случай, если вам нужно плавно объединить два эллипса. Больше он ничего не делает, но от него больше и не надо, мне кажется — в любом случае, лишним в вашей библиотеке плагинов он точно не будет 😊 🎨 Дизайн База. Подписаться #Плагины #Figma