Components
Features

Features

The Features component provides you with feature showcase sections for landing pages.

Live Examples

Live Example
View Code
import { Features } from '@nostromo/ui-marketing'

export default function FeaturesExample() {
  return (
    <Features
      title="Why Choose Nostromo UI?"
      subtitle="Built with modern web standards and best practices"
      features={[
        {
          title: "TypeScript First",
          description: "Full TypeScript support with strict type checking",
          icon: "Code"
        },
        {
          title: "Accessible",
          description: "WCAG 2.1 AA compliant components out of the box",
          icon: "Accessibility"
        },
        {
          title: "Customizable",
          description: "CSS variables and Tailwind for easy theming",
          icon: "Palette"
        }
      ]}
    />
  )
}

Code Examples

Props

PropTypeDefaultDescription
titlestring-Section title
subtitlestring-Section subtitle
featuresFeature[]-Array of feature objects
columnsnumber3Number of columns
variant"default" | "cards" | "minimal""default"Feature variant