React ui framework based on Figma design system

Usage no npm install needed!

<script type="module">
  import reactFigmaPluginDs from '';



npm npm bundle size npm

React components of Figma design system based on thomas-lowry/figma-plugin-ds, and implements UI2: Figma Design System.


🚀 Get Started

Follow these steps to start using React Figma components:

  1. Installation:

    # with npm
    npm i react-figma-plugin-ds
    # with yarn
    yarn add react-figma-plugin-ds
  2. Usage:

    import React from "react";
    import { Disclosure, Tip, Title, Checkbox, Button } from "react-figma-plugin-ds";
    import "react-figma-plugin-ds/figma-plugin-ds.css";
    export default (props) => {
      return (
          <Title size="large" weight="bold">
            My plugin
          <Disclosure label="Getting started" isDefaultExpanded>
            <Tip iconName="resolve">Install</Tip>
            <Tip iconName="play">Start</Tip>
            <Tip iconName="library">Read the docs</Tip>
          <Checkbox label="I promise to star this repo!" />
  3. Discover all components with properties on demo page. Each of that has playground and as result in top right corner you can easily copy final code.

📝 License