---
title: "Core — flex-child"
canonical: https://sky-ui.cf.sky.com/core/system/flex-child
---

# Core — flex-child

Applying the `flex-child` system modifier to your component will allow consumers of your component to pass in the following props:

| Prop | Type | Description |
| --- | --- | --- |
| `$alignSelf` | [See MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/align-self) | Applies align-self styles to the element |
| `$flex` | [See MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/flex) | Applies flex styles to the element |
| `$flexGrow` | [See MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/flex-grow) | Applies flex-grow styles to the element |
| `$flexShrink` | [See MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/flex-shrink) | Applies flex-shrink styles to the element |
| `$flexBasis` | [See MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/flex-basis) | Applies flex-basis styles to the element |
| `$order` | [See MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/order) | Applies order styles to the element |