Blueprints

Blueprints are the building blocks used to design pages. The starter kit ships several dozens of them. (In fact most of what you see on this website is created with blueprints from the starter kit).
Click to show all starter blueprints
As a developer you can create custom blueprints. Blueprints are JSX / TSX files ending with ".np.jsx" or ".np.tsx", exporting a Solid component and a "blueprint" function. The blueprint function does define the available editor settings for the respective component.To scaffold your first custom blueprint, open the project path in your terminal and run:
npx np blueprint <blueprintName>
The vite development server will automatically detect your new blueprint and you can create a new element with it, via the page editor from the dashboard. Next you can start making changes to the "src/blueprints/blueprintName.np.tsx" file and the changes will automatically be applied via hot module replacement.