Neumorphism CSS Shadow — двуслоен код
Създайте CSS код за сянка на кутия визуално: плъзгачи за отместване, замъгляване, разпространение, цвят с непрозрачност, режим на вмъкване и до четири слоя с преглед на живо.
Резултат
Тази страница отваря генератора с класическата неуморфна двойка, която вече е изградена: светъл слой с отместване −8px/−8px в почти бяло и тъмен слой с отместване 8px/8px в приглушено сиво-синьо, и двата замъглени с 16px. Превключвайте между двата слоя в списъка със слоеве, за да настроите всяка страна независимо.
Neumorphism (soft UI) е релефният стил, който достигна своя връх около 2020 г.: елементите изглеждат екструдирани от фона, вместо да плават над него. Честно казано, идва с истински компромиси – ефектът работи само когато фонът на елемента съвпада с фона на страницата, а ръбовете с нисък контраст могат да навредят на достъпността – така че повечето екипи сега го използват като акцент, а не като цялостен дизайнерски език.
Ако стилът отговаря на вашия проект, тази двуслойна декларация е каноничната отправна точка: копирайте CSS, задайте елемента и фона на страницата на същото меко сиво и добавете съответстващ радиус на границата. Всичко работи локално във вашия браузър.