Neumorfisme CSS-schaduw: code met twee lagen
Creëer visueel CSS-vakschaduwcode: schuifregelaars voor offset, vervaging, spreiding, kleur met dekking, inzetmodus en maximaal vier lagen met een live voorbeeld.
Resultaat
Deze pagina opent de generator met het klassieke neumorfe paar dat al is gebouwd: een lichte laag met een offset van −8px/−8px in bijna wit en een donkere laag met een offset van 8px/8px in een gedempt grijsblauw, beide wazig 16px. Schakel tussen de twee lagen in de lagenlijst om elke kant afzonderlijk af te stemmen.
Neumorfisme (zachte gebruikersinterface) is de reliëfstijl die rond 2020 zijn hoogtepunt bereikte: elementen zien eruit alsof ze uit de achtergrond zijn geëxtrudeerd in plaats van erboven te zweven. Eerlijk gezegd brengt het echte compromissen met zich mee – het effect werkt alleen als de achtergrond van het element overeenkomt met de achtergrond van de pagina, en de randen met laag contrast kunnen de toegankelijkheid schaden – dus gebruiken de meeste teams het nu als een accent, niet als een hele ontwerptaal.
Als de stijl bij uw project past, is deze tweelaagse declaratie het canonieke startpunt: kopieer de CSS, stel het element en de pagina-achtergrond in op hetzelfde zachte grijs en voeg een bijpassende randradius toe. Alles draait lokaal in uw browser.