āđ€āļ„āļĢāļ·āđˆāļ­āļ‡āļŠāļĢāđ‰āļēāļ‡ Box Shadow CSS

āļŠāļĢāđ‰āļēāļ‡āđāļĨāļ°āļ”āļđāļ•āļąāļ§āļ­āļĒāđˆāļēāļ‡āļ„āļļāļ“āļŠāļĄāļšāļąāļ•āļī CSS box-shadow āļ”āđ‰āļ§āļĒāļ āļēāļž

āļāļēāļĢāļ•āļąāđ‰āļ‡āļ„āđˆāļēāđ€āļ‡āļē
āļ›āļĢāļąāļšāđāļ–āļšāđ€āļĨāļ·āđˆāļ­āļ™āđ€āļžāļ·āđˆāļ­āļ›āļĢāļąāļšāđāļ•āđˆāļ‡āđ€āļ­āļŸāđ€āļŸāļāļ•āđŒāđ€āļ‡āļē

āđ€āļ‡āļē 1

āļ„āđˆāļēāļ—āļĩāđˆāļ•āļąāđ‰āļ‡āđ„āļ§āđ‰āļĨāđˆāļ§āļ‡āļŦāļ™āđ‰āļē
āļĨāļ­āļ‡āđƒāļŠāđ‰āļŠāđ„āļ•āļĨāđŒāđ€āļ‡āļēāļ—āļĩāđˆāļāļģāļŦāļ™āļ”āđ„āļ§āđ‰āļĨāđˆāļ§āļ‡āļŦāļ™āđ‰āļē
āļ”āļđāļ•āļąāļ§āļ­āļĒāđˆāļēāļ‡
āļ”āļđāļ•āļąāļ§āļ­āļĒāđˆāļēāļ‡āđ€āļ­āļŸāđ€āļŸāļāļ•āđŒāđ€āļ‡āļēāļ—āļĩāđˆāļŠāļĢāđ‰āļēāļ‡āļ‚āļķāđ‰āļ™
Preview
CSS āļ—āļĩāđˆāļŠāļĢāđ‰āļēāļ‡āļ‚āļķāđ‰āļ™
box-shadow: 0px 4px 6px 0px #00000040;
āļāļēāļĢāļ­āđ‰āļēāļ‡āļ­āļīāļ‡āļ„āļļāļ“āļŠāļĄāļšāļąāļ•āļī Box Shadow

āļ„āļģāļ­āļ˜āļīāļšāļēāļĒāļ„āļļāļ“āļŠāļĄāļšāļąāļ•āļī

  • â€Ē X Offset: āļ•āļģāđāļŦāļ™āđˆāļ‡āđāļ™āļ§āļ™āļ­āļ™āļ‚āļ­āļ‡āđ€āļ‡āļē (āļšāļ§āļ: āļ‚āļ§āļē, āļĨāļš: āļ‹āđ‰āļēāļĒ)
  • â€Ē Y Offset: āļ•āļģāđāļŦāļ™āđˆāļ‡āđāļ™āļ§āļ•āļąāđ‰āļ‡āļ‚āļ­āļ‡āđ€āļ‡āļē (āļšāļ§āļ: āļĨāđˆāļēāļ‡, āļĨāļš: āļšāļ™)
  • â€Ē Blur: āļĢāļąāļĻāļĄāļĩāđ€āļšāļĨāļ­āļ‚āļ­āļ‡āđ€āļ‡āļē (0: āļ„āļĄāļŠāļąāļ”, āļ„āđˆāļēāļĄāļēāļ: āđ€āļšāļĨāļ­āļĄāļēāļāļ‚āļķāđ‰āļ™)
  • â€Ē Spread: āļ‚āļ™āļēāļ”āļ‚āļ­āļ‡āđ€āļ‡āļē (āļšāļ§āļ: āļ‚āļĒāļēāļĒ, āļĨāļš: āļŦāļ”)
  • â€Ē āļŠāļĩ: āļŠāļĩāļ‚āļ­āļ‡āđ€āļ‡āļē (HEX, RGB, RGBA, āļŊāļĨāļŊ)
  • â€Ē Inset: āđ€āļ‡āļēāđ€āļ›āđ‡āļ™āđ€āļ‡āļēāļ”āđ‰āļēāļ™āđƒāļ™āļŦāļĢāļ·āļ­āđ„āļĄāđˆ