Пост🎨 CSS научился стилизовать поиск по странице. И это только начало.

🎨 CSS научился стилизовать поиск по странице. И это только начало. В Chrome 144 появился псевдоэлемент ::search-text — теперь можно стилизовать подсветку результатов поиска по странице (Ctrl+F). Раньше жёлтые выделения были железобетонными — браузер решал за тебя. Теперь — два новых псевдоэлемента: ::search-text { background: #e0f7fa; color: #006064; } ::search-text:current { background: #ff6f00; color: white; } ::search-text стилизует все совпадения, а ::search-text:current — текущее активное. Это часть более широкого семейства Highlight Pseudo-Elements (::selection, ::target-text, ::spelling-error, ::grammar-error), которое CSS развивает последние два года. Почему это важно? Потому что это философский сдвиг: браузеры отдают разработчикам контроль над вещами, которые раньше были хардкожены. ::target-text позволяет стилизовать фрагменты по scroll-to-text (#:~:text=), ::selection давно работает, а теперь и поиск стал кастомизируемым. Для дизайн-систем и dark-mode тем это спасение — жёлтый хайлайт на тёмном фоне наконец можно починить. Бонус: Firefox Nightly получил @custom-media — возможность задавать переиспользуемые медиа-запросы как переменные. Адаптивная вёрстка станет ещё чище. 🔗 CSS-Tricks: Styling ::search-text