Fractal screenshot

Fractal

Author Avatar Theme by Frctl
Updated: 26 Jan 2023
2118 Stars

A tool to help you build and document website component libraries and design systems.

Categories

Overview

Fractal is a tool that helps users build and document website component libraries and design systems. It allows for modular website design by breaking up the UI into small, reusable chunks that can be assembled in various ways. Fractal can be used to preview and document component libraries, or to scale up and document entire design systems for organizations.

Features

  • Assembles and previews website component libraries
  • Allows for modular website design
  • Helps document component libraries and design systems

Installation

To install Fractal into your project, follow these steps:

Install into your project (recommended)

  1. Ensure you have a supported LTS version of Node.
  2. Run the following command in your project root: npm install fractal
  3. Create a fractal.config.js file in the project root.
  4. Configure Fractal using the official documentation.
  5. Start the Fractal project by running either npx fractal start or creating an alias in your package.json under the scripts section.

Installing globally

  1. Ensure you have a supported LTS version of Node.
  2. Run the following command: npm install -g fractal This will give you global access to the Fractal command. Note: This option is not recommended if you need to use different Fractal versions on different projects.

Summary

Fractal is a powerful tool for building and documenting website component libraries and design systems. It allows for modular website design and provides the ability to preview and document components in an organized manner. With its installation options and extensive documentation, Fractal is a valuable asset for web designers and developers.