## Props

[Props](https://docs.astro.build/en/core-concepts/astro-components/#component-props) are inputs to astro components, used to pass data from a parent component to a child component.

> **Consider:**
> Props, or properties, are variable inputs that can be passed into the [frontmatter](#frontmatter) of an [Astro component](#astro-component). These props can be defined using an interface declaration (`interface Props`), and accessed using `Astro.props` within the frontmatter. The props can then be set using HTML's `attribute` syntax.
> [name=Voxel][color=gold]

> *If we want code examples, we can go for this:*
> ```
> // Component.astro
> ---
> interface Props {
> title: string;
> }
> const { title } = Astro.props;
> ---
> // index.astro
> <Component title="Hello Houston!" />
> ```
> [name=Voxel][color=green]