react-figma-plugin-ds

    2.3.0 • Public • Published

    react-figma-plugin-ds

    npm npm bundle size npm

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

    DEMO HERE

    🚀 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
            </Title>
      
            <Disclosure label="Getting started" isDefaultExpanded>
              <Tip iconName="resolve">Install</Tip>
              <Tip iconName="play">Start</Tip>
              <Tip iconName="library">Read the docs</Tip>
            </Disclosure>
      
            <Checkbox label="I promise to star this repo!" />
      
            <Button>Start</Button>
          </>
        );
      };
    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

    MIT

    Install

    npm i react-figma-plugin-ds

    DownloadsWeekly Downloads

    111

    Version

    2.3.0

    License

    MIT

    Unpacked Size

    158 kB

    Total Files

    47

    Last publish

    Collaborators

    • alexandrtovmach