Runway

Features

Tired of starting from scratch?

Tired of having to set up auth, payments, databases, components, SEO,... the list goes on. Runway has everything you need to launch your ideas.

Auth

Payments

Database

SEO

Components

Auth

Implement robust user authentication and authorization using Supabase.

Magic links & Social auth
Email/password login
Login/Signup pages
Protected routes
3+ hours saved

with

Supabase

Payments

Securely accept payments and manage subscriptions with Stripe integration.

One time payments
Subscriptions
Webhook handling (to update user's account)
Invoices
3+ hours saved

with

Stripe

Database

Harness Supabase’s PostgreSQL DB for real-time data sync.

SQL database
Real-time data sync
User database
3+ hours saved

with

Supabase

Email

Integrate seamless email communication with Resend.

Email verification
Transactional emails
Newsletters
3+ hours saved

with

Resend

SEO

Boost your visibility with built-in SEO tools, auto meta tags, etc.

Meta tags
Sitemaps
Structured data
3+ hours saved

Check out

the docs

Components

Use our library of pre-built, customizable components.

Pre-built components
Customizable UI
Responsive design
10+ hours saved

Check out

the docs

The FeaturesCarousel component is a great way to showcase features in a carousel format. It uses the Card and Carousel components to create a visually appealing and interactive experience. Features are pulled from the config.js file by default.

Usage

javascript
1import FeaturesCarousel from '@/components/landing/FeaturesCarousel';
2
3<FeaturesCarousel />

Props

Name	Type	Default	Description
title	string	`""`	The title of the component.
subtitle	string	`""`	The subtitle of the component.
description	string	`""`	The description of the component.
features	array	`featuresConfig`	The list of features to display, each feature is an object with `title`, `description`, `icon`, `imageSrc`, `imageAlt`, and `imageHref` properties. By default its pulled from config, see docs for more details.
autoPlay	boolean	`true`	If true, the carousel will autoplay.
interval	number	`5000`	The interval between slides in milliseconds.
cardColor	string	`"bg"`	The base color (use tailwind.config).
cardVariant	string	`"soft"`	The variant of the component.
cardBorderRadius	string	`"lg"`	The border radius of the card (using Tailwind border radius classes).
cardBorder	boolean	`false`	If true, a border will be displayed on the cards.
highlightLastFeature	boolean	`false`	If true, the last feature will be highlighted.