Frontend Developer

Маленькие прописные буквы, или капитель, это особый стиль оформления текста. Они выглядят как прописные, но по высоте совпадают со строчными. Такой приём давно используется в типографике для выделения отдельных фрагментов и придания тексту выразительности. Это легко реализовать и в вебе, в CSS достаточно задать свойство font-variant-caps small-caps включает капитель только для строчных букв all-small-caps превращает в капитель и строчные, и прописные ➡️ @byFrontDeveloper

Держите классную находку для веб-разработчиков Cursor Effects это набор ретро-эффектов курсора с кучей вариаций. Бесплатно, open source, и встраивается в проект буквально за пару строк кода. Мгновенно добавляет сайту креатива и выделяет его среди остальных :) github.com/tholman/cursor-effects ➡️ @byFrontDeveloper

Знаете ли вы, что свойство align-content применяется к блочным элементам? Более того, вы можете использовать значение space-around, чтобы выровнять содержимое по вертикали Читайте эту статью, чтобы узнать, почему (и раскрыть еще больше тайн выравнивания) 🧀 ➡️ @byFrontDeveloper

Сохраняй себе 5 топовых тулз для веб-разработчиков Эти инструменты ускоряют работу, помогают писать чище и экономят время. Отличный набор, который стоит держать под рукой: SVG Flag Icons — nucleoapp.com/svg-flag-icons EmbedPDF — embedpdf.com FliiipBook — fliiipbook.com use-mcp — github.com/modelcontextprotocol/use-mcp DayPicker — daypicker.dev Пригодятся в любом проекте 🎵 ➡️ @byFrontDeveloper

Знакомьтесь, Алина Карашова - кандидат экономических наук, доцент, квалифицированный финансовый консультант, лектор общества «Знание», квалифицированный инвестор, более 6 лет в инвестициях У Алины авторский канал для тех, кто хочет углубиться в тему личных финансов и инвестиций В своем канале Алина: ➖комментирует важнейшие экономические события [Зачем подняли НДС?] ➖дает комментарии по наиболее важным инвестиционным инструментам и компаниям [Как инвестировать в доллары?] ➖ пишет про ловушки и ла...

Этот HTML-тег никто не использует, а он реально крутой ➡️ @byFrontDeveloper

Можно сделать UI чище, уменьшив или убрав скроллбары с помощью свойства scrollbar-width Пример тонкого скроллбара: ul { scrollbar-width: thin; } Пример скрытого скроллбара (область остаётся скроллируемой): .cards-container { scrollbar-width: none; } Подойдет под сайдбары, таблицы данных, чат-панели, дашборды с кучей скроллов, карусели, тач-интерфейсы. В итоге скролл работает, но UI выглядит аккуратнее. 🥺 ➡️ @byFrontDeveloper

Совет по CSS Не нужно готовить отдельные версии логотипа в градациях серого для тёмной и светлой темы. Это легко делается с помощью CSS-фильтров. / Для светлой темы / .logos-container img { filter: brightness(0); opacity: 0.6; } / Для тёмной темы / .logos-container img { filter: invert(1) saturate(0) brightness(4); opacity: 0.6; } ➡️ @byFrontDeveloper

Неожиданный лайфхак для разработчиков 🤯 Оказывается, любую страницу в браузере можно превратить в текстовый редактор одной строкой JavaScript: document.designMode = "on"; Всё содержимое страницы становится редактируемым, режим можно включать и выключать в любой момент, работает во всех топовых браузерах — Chrome, Firefox, Safari, Edge. Удобная штука для быстрых мокапов, проверки идей по UI или просто чтобы пофаниться. Иногда самые мощные фичи годами лежат прямо на поверхности 🙂 ➡️ @byFrontDeve...

Набравший популярность лайфхак для GitHub Хочешь мгновенно получить документацию по любому репозиторию с помощью ИИ? Просто зайди в репо и в адресной строке замени github на deepwiki Через секунду у тебя будет готовая документация по проекту прямо в браузере. 😠 ➡️ @byFrontDeveloper