CSS Box Shadow Generator

En box-shadow-deklaration har seks bevægelige dele - X- og Y-offset, sløring, spredning, farve og det valgfri indsatte nøgleord - og den eneste måde at få dem rigtigt er at se dem. Denne generator sætter hver del på en skyder og gengiver resultatet på et forhåndsvisningskort, mens du trækker, så CSS-linjen nederst altid er præcis, hvad du ser på.

Virkelige skygger er sjældent et enkelt lag. Laglisten giver dig mulighed for at stable op til fire skygger i én erklæring: en stram mørk linje til kantdefinition plus en bred blød vask til elevation eller det lys-og-mørke par, der definerer neumorfi. Vælg et lag for at redigere det, fjern dem, du ikke har brug for, og den kombinerede box-shadow-værdi opdateres live.

Shadows læser meget forskelligt på mørke interfaces, hvor en sort skygge på en næsten sort side simpelthen forsvinder. Forhåndsvisningsbaggrundsskiftet skifter baggrunden mellem lys og mørk, så du kan tjekke begge temaer inden forsendelse. Forudindstillede sider dækker de varianter, folk rent faktisk søger efter: en blød elevationsskygge, en indsat brønd, opskriften på to-lags neumorfi og en subtil kortskygge.

Som ethvert værktøj på dette websted er generatoren gratis og kører udelukkende i din browser: ingen upload, ingen konto, og den fortsætter med at arbejde offline, når siden er indlæst.