# Concepts and Principles

# Composition

One of the core concepts of mise-en-place is the use of composition over inheritance. Each of the components in the library is meant to be pieced together (either around, inside, or as children of other components) in order to build larger, more complex layouts. Rather than building layout components that are specific to single

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Perspiciatis inventore autem minus optio dolorem id. Cumque pariatur ex facere voluptatem perspiciatis porro libero. Suscipit blanditiis eum saepe obcaecati quis aliquam?

# CSS Custom Properties

mise-en-place makes heavy use of CSS Custom properties.

# Spacing Scale

The spacing scale used by mise-en-place allows users to quickly and easily build layouts with a consistent visual harmony.

# Responsive Props

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Perspiciatis inventore autem minus optio dolorem id. Cumque pariatur ex facere voluptatem perspiciatis porro libero. Suscipit blanditiis eum saepe obcaecati quis aliquam?

# Semantic HTML

When possible, mise-en-place allows you to specify an as prop for components. This is used to render the component as the desired HTML element. You're encouraged to use this as much as possible in order to produce apps composed of sem