Feature - ShipKit Docs

Usage

---
import { Feature } from '~/components';
---

<Feature
  title="Support for Astro & Next.js"
  imageLight="https://assets.shipkit.app/placeholder/light/feature-astro-next.svg"
  imageDark="https://assets.shipkit.app/placeholder/dark/feature-astro-next.svg"
  text="ShipKit offers you the freedom to choose a boilerplate based on Astro or Next.js, empowering you to select the meta-framework that best fits your project's needs. This choice ensures you start with the strongest foundation possible, tailored to your development style."
/>

---
import { Feature } from '~/components';
---

<Feature
  title="Support for Astro & Next.js"
  imageLight="https://assets.shipkit.app/placeholder/light/feature-astro-next.svg"
  imageDark="https://assets.shipkit.app/placeholder/dark/feature-astro-next.svg"
  text="ShipKit offers you the freedom to choose a boilerplate based on Astro or Next.js, empowering you to select the meta-framework that best fits your project's needs. This choice ensures you start with the strongest foundation possible, tailored to your development style."
/>

import { Feature } from '~/components';

export default async function Page() {
  return (
    <Feature
      title="Support for Astro & Next.js"
      imageLight="https://assets.shipkit.app/placeholder/light/feature-astro-next.svg"
      imageDark="https://assets.shipkit.app/placeholder/dark/feature-astro-next.svg"
      text="ShipKit offers you the freedom to choose a boilerplate based on Astro or Next.js, empowering you to select the meta-framework that best fits your project's needs. This choice ensures you start with the strongest foundation possible, tailored to your development style."
    />
  );
}

Props

title

string

required

The title of the feature.

text

string

required

The description of the feature.

imageLight

string

The image for the feature in light mode.

imageDark

string

The image for the feature in dark mode.

alt

string

The alt text for the image.

label

string

The label above the title of the feature.

reverse

boolean

Reverse the order of the image and text.

Components

​Usage

​Props

Usage

Props