Javascript js frontend

Cloud Upload Bubbles

При нажатии на кнопку запускается CSS-анимация, применяемая к генерируемым элементам.

#js

​Как добавить программируемый поиск от Google на свой сайт?

В этой статье мы разберем, как добавить на свой сайт программируемый поиск от Google. Начнем с создания поисковой системы, затем настроим ее и завершим все это дело получением кода системы и встраиванием его на свой сайт.

#js #ru

Newspaper Layout

Макет газеты, написан на чистом CSS.

#css

Как создать радиальный градиент в CSS?

Для создания фона в виде радиального (кругового, эллиптического) градиента испольуется функция radial-gradient.

Самый простой градиент задаётся двумя цветами.
.element {
background-image: radial-gradient(#6e4aff, #49A16C);
}

В этом случае начальная точка помещается в центр элемента, а градиент рисуется таким образом, чтобы в углах элемента был последний указанный в скобках цвет.

Цветов мы можем перечислить сколько угодно. Браузер сам распределит градиент таким образом, чтобы последний цвет всегда заходил в угол элемента.

Форма градиента задаётся ключевым словом circle или ellipse (по умолчанию).

Мы можем задавать положение центральной точки, используя те же ключевые слова, что и для background-position, но с приставкой at: at left, at top, at right, at bottom, at center (по умолчанию). Значения можно сочетать, чтобы поместить центр градиента в нужный угол элемента: at top left — центр градиента в верхнем левом углу.

#css

Clean Code Cookbook

Автор: Maximiliano Contieri
Год издания: 2023

#en

drip.

Текст с капающей с него краской. Создано на SCSS, без JavaScript.

#css

​Как я запрограммировала собственный рукописный шрифт

Недавно я создала на JavaScript собственный блочный шрифт, решив, что запрограммировать слитное рукописное письмо будет слишком сложно. Но не прошло и двух месяцев, как вот я здесь и готова рассказать о созданном мной механизме слитного письма.

#js #ru

Leaky Preloader

Оригинальный загрузчик, созданный на HTML и CSS.

#css

Javascript js frontend pinned «Задачи по Front-end - канал с задачками и тестами по JS/CSS/HTML. На канале вы найдете: - тесты по Javascript; - тесты по CSS; - тесты по HTML; - вопросы с собеседований с решением по JS, CSS, HTML Подписывайтесь, решайте и предлагайте свои решения: @frontquizes»

A Brief Introduction to Web3

Автор: Shashank Mohan Jain
Год издания: 2023

#en

Snowball Preloader

Зимний загрузчик, созданный на HTML и CSS.

#css

​Эффект размытия вместо тени на CSS

С тенями в CSS все довольно просто: объявляете свойство box-shadow, задаете смещения тени, определяете размытие и задаете цвет. Это отличный способ придать глубину тому, что в остальном было бы плоским дизайном!

Черпая вдохновение в тенях, автор статьи Яир Эвен Ор (Yair Even Or) создает нечто подобное, только с эффектом размытия вместо тени. В этой статье вы получите пошаговое объяснение того, как это делается с помощью комбинации масок, градиентов и старого доброго свойства backdrop-filter.

#css #ru