Luo kauniita CSS-laatikon varjoja vaivattomasti
Luo upeita laatikon varjoja intuitiivisella käyttöliittymällämme. Kopioi CSS-koodi ja käytä sitä projekteissasi välittömästi.
Preview
Otsikkoruutu Varjo
Mukauta minua
CSS-lähtö
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
Varjosäätimet
Position
0px
4px
Size
6px
-1px
Color
10%
Options
Presets
Pehmeä varjo
Keskivarjo
Raskas varjo
Sisäinen varjo
Terävä diagonaalinen
ääriviiva Hehku
Kaksoisvarjo
Kohonnut tehoste
käyttäminen
Perussäätimien
- Säädävaakasuuntaista siirtymäävarjon siirtämiseksi vasemmalle tai oikealle
- Säädäpystysuuntaista siirtymäävarjon siirtämiseksi ylös tai alas
- Suurennasumennuksen sädettä,jos haluat tehdä varjosta pehmeämmän
- Use Levityksessäde,jos haluat suurentaa tai pienentää varjon
- MuutaColor and Opacityvarjon ulkoasun
Advanced Features
- Enable Upotettu varjosisäisen varjotehosteen
- Use Useita varjojamonimutkaisempiin tehosteisiin
- Tallenna ja lataaPresetsjotta pääset nopeasti käsiksi suosikkivarjoihisi
- Click Random Shadowinspiraatiota
- varten Kopioi luotu CSS-koodi ja liitä se projektiin
Related Tools
Kynän muunnos CSS-muotoon
Muunna SCSS-koodisi CSS:ksi. Nopeaa, helppoa ja turvallista.
Less CSS-muotoon -muunnin
Muunna Less-koodisi CSS:ksi. Nopeaa, helppoa ja turvallista.
CSS3-siirtymägeneraattori
Sujuva peittävyyden siirtyminen
Aikayksikkömuunnin
Muunna vertailun välilläSiirrä aikayksiköitä tarkasti tieteellisiin, teknisiin ja jokapäiväisiin tarpeisiisi
Heksa tekstiksi
varten Muunna heksadesimaaliesitys tekstiksi vaivattomasti
Paineyksikkömuunnin
Muunna eri paineyksiköiden välillä Tarkkuutta teknisiin ja tieteellisiin tarpeisiisi