# Atomic Layout

## Atomic Layout

- [Introduction](https://redd.gitbook.io/atomic-layout/master.md)
- [Motivation](https://redd.gitbook.io/atomic-layout/motivation.md)
- [Resources](https://redd.gitbook.io/atomic-layout/resources.md)
- [FAQ](https://redd.gitbook.io/atomic-layout/faq.md)
- [Comparison with styled-system](https://redd.gitbook.io/atomic-layout/faq/comparison-with-styled-system.md)
- [Installation](https://redd.gitbook.io/atomic-layout/getting-started/installation.md)
- [First composition](https://redd.gitbook.io/atomic-layout/getting-started/first-composition.md)
- [Responsive composition](https://redd.gitbook.io/atomic-layout/getting-started/responsive-composition.md)
- [Nested composition](https://redd.gitbook.io/atomic-layout/getting-started/nested-composition.md)
- [Breakpoints](https://redd.gitbook.io/atomic-layout/fundamentals/breakpoints.md)
- [Prop aliases](https://redd.gitbook.io/atomic-layout/fundamentals/prop-aliases.md)
- [Responsive props](https://redd.gitbook.io/atomic-layout/fundamentals/responsive-props.md)
- [Layout](https://redd.gitbook.io/atomic-layout/api/layout.md)
- [configure()](https://redd.gitbook.io/atomic-layout/api/layout/configure.md)
- [Components](https://redd.gitbook.io/atomic-layout/api/components.md)
- [Box](https://redd.gitbook.io/atomic-layout/api/components/box.md)
- [Composition](https://redd.gitbook.io/atomic-layout/api/components/composition.md)
- [Only](https://redd.gitbook.io/atomic-layout/api/components/only.md)
- [Visible](https://redd.gitbook.io/atomic-layout/api/components/visible.md)
- [Hooks](https://redd.gitbook.io/atomic-layout/api/hooks.md)
- [useMediaQuery](https://redd.gitbook.io/atomic-layout/api/hooks/use-media-query.md)
- [useResponsiveQuery](https://redd.gitbook.io/atomic-layout/api/hooks/use-responsive-query.md)
- [useViewportChange](https://redd.gitbook.io/atomic-layout/api/hooks/use-viewport-change.md)
- [useBreakpointChange](https://redd.gitbook.io/atomic-layout/api/hooks/use-breakpoint-change.md)
- [useResponsiveValue](https://redd.gitbook.io/atomic-layout/api/hooks/use-responsive-value.md)
- [useResponsiveProps](https://redd.gitbook.io/atomic-layout/api/hooks/use-responsive-props.md)
- [Utilities](https://redd.gitbook.io/atomic-layout/api/utilities.md)
- [query](https://redd.gitbook.io/atomic-layout/api/utilities/query.md): A utility function for composing an inline media query string in CSS.
- [makeResponsive](https://redd.gitbook.io/atomic-layout/api/utilities/use-responsive-component.md)
- [Semantics](https://redd.gitbook.io/atomic-layout/recipes/semantics.md)
- [Namespaces](https://redd.gitbook.io/atomic-layout/recipes/namespaces.md)
- [Iterative areas](https://redd.gitbook.io/atomic-layout/recipes/iterative-areas.md)
- [Responsive layout](https://redd.gitbook.io/atomic-layout/recipes/responsive-layout.md)
- [Explicit media query](https://redd.gitbook.io/atomic-layout/recipes/explicit-media-query.md)