NotesChangelogAPIAbout

Box Shadows

Box-shadow is a powerful and flexible CSS property. Similar to gradients, the box-shadow property allows for you to declare multiple box shadows on a single element with a comma-separated list of shadows. There are an endless amount of creative outcomes. These can be time consuming to iterate through in code, so we wanted to make it a little easier to experiment with what's possible.

Our existing box shadow components had fixed counts of shadows. Similar to our updated gradient component, we now support stacking shadows. Soon we'll be rolling out support for stacking text-shadows as well.

This is the second component we've rolled out since beginning full-time and it comes with a few enhancements over our existing components. For logged in users, we're exposing your likes and saves so you can navigate back through them and share with others. We've also opened up one-click publishing for everyone so you can quickly share your creations with friends and teammates.

Roadmap

  • Global color controls
  • Relationships between layers
  • :before and :after
  • :hover and :focus
  • Vector controls
  • Animations
  • Add to theme
New
DelanuayVoronoiColor ScalesGradientsText ShadowsBox Shadows
ChangelogNotesAPI
© Copyright 2018-2020hello@components.ai@components_aiTermsPrivacy© Copyright 2018-2020