---
title: Blueprints
description: Kickstart your Storyblok project with your favourite framework — Astro, Next.js, Nuxt, and more. Connect your GitHub repository and deploy automatically with Vercel or Netlify. Visual Editor setup included.
url: https://storyblok.com/docs/concepts/blueprints
---

# Blueprints

Storyblok Blueprints are the fastest and most efficient way to launch a new project with one of the supported frontend frameworks. Blueprints streamline the process of deploying to [Vercel](https://vercel.com/) or [Netlify](https://www.netlify.com/) and connecting the project to the [Visual Editor](/docs/concepts/visual-editor).

## Setup

In your Storyblok account, under [My Spaces](https://app.storyblok.com/#/me/spaces), click **Add Space** and choose **Start from Blueprint**.

1.  **Choose a Blueprint**
    
    Select a blueprint to start your project.
    
2.  **Create a Space**
    
    Type a name for the new space.
    
3.  **Connect to GitHub and select a framework**
    
    Authorize Storyblok to access your GitHub account. Choose the target GitHub account and allow Storyblok to create a repository.
    
    Choose a framework.
    
    A new repository will be generated using the selected blueprint.
    
    To clone the project locally, copy and run the provided `git clone` command.
    
4.  **Deploy your project**
    
    Deploy the blueprint project to a supported hosting platform: **Vercel** or **Netlify**.
    
    Authorize the selected platform to access your GitHub repository.
    
    Specify the project's name on the hosting platform.
    
5.  **Explore the Figma Plugin (optional)**
    
    Optionally, connect Figma to sync your design system. Once configured, import Figma components as blocks into the Storyblok space.
    
    Learn more in the [Figma Plugin documentation](https://www.storyblok.com/lp/figma-to-storyblok).
    
6.  **Select a Plan**
    
    Either choose a premium plan now, or continue with the free starter plan.
    

## Core Blueprints

The Core Blueprint is a minimal, framework-specific starter project that provides only the essential setup required to begin development. Using Storyblok's SDK ecosystem, it comes with preconfigured dynamic routing and visual editing, and a basic set of blocks. This blueprint is intended for developers seeking a clean, unopinionated foundation that can be fully customized to meet specific project requirements.

Currently, the following frameworks are supported:

-   **Astro** ([GitHub template](https://github.com/storyblok/blueprint-core-astro))
-   **Next.js** ([GitHub template](https://github.com/storyblok/blueprint-core-nextjs))
-   **Nuxt** ([GitHub template](https://github.com/storyblok/blueprint-core-nuxt))
-   **React** ([GitHub template](https://github.com/storyblok/blueprint-core-react))
-   **Vue** ([GitHub template](https://github.com/storyblok/blueprint-core-vue))
-   **Eleventy** ([GitHub template](https://github.com/storyblok/blueprint-core-eleventy))

> [!TIP]
> To use the [Storyblok CLI](https://www.storyblok.com/docs/libraries/storyblok-cli) to create a new space with a connected local Core Blueprint, run the `storyblok create` command.

## Business Blueprint

The Business Blueprint is a starter project tailored for companies and agencies. It features a polished layout, a set of preconfigured blocks, and includes essential pages such as Home, About, and Services.

Currently, the following frameworks are supported:

-   **Next.js** ([GitHub template](https://github.com/storyblok/blueprint-business-nextjs))
-   **Nuxt** ([GitHub template](https://github.com/storyblok/blueprint-business-nuxt))

## Pagination

-   [Previous: Blocks](/docs/concepts/blocks)
-   [Next: Caching](/docs/concepts/caching)