When creating a layout or pattern, Sequoia designs will often rely on white space and visual hierarchy to support clear and airy interactions. However, specific object styles may be implemented when a component or component group must be visually separated from the rest of the page.
Rounded corners are used throughout Sequoia. If a component has visible boundaries—such as a color fill, a border, or drop shadow—its corners will typically appear rounded.
Most corner radius values align with our global spacing increment of four pixels.
A component’s default corner radius value is often based on its relative size on the page.
Some components are fully rounded, creating a “pill shape”.
A one-pixel border is often the simplest way to suggest a boundary, especially when open/white space can't be easily implemented to create a separation between or around design elements.
Drop shadows are used to convey depth between UI elements, also known as elevation. They are only deployed in alignment to the Sequoia elevation guidelines.
