Skip to content

react-figma/figma-ui-components

Repository files navigation

figma-ui-components

npm version

An unofficial set of Figma UI components for creating plugins and other purposes. Based on Tom Lowry's Figma UI JS/CSS files.

  • Uses React ⚛️, styled-components 💅, TypeScript.
  • Stateful components, fully controlled outside.
  • All components showed at Storybook.

Installation

Install it with yarn:

yarn add figma-ui-components

Or with npm:

npm i figma-ui-components --save

Usage

Global styles

import * as React from 'react'
import {TypographyStyles, BaseStyles} from "figma-ui-components"

const App = () => {
    return <>
        <BaseStyles />
        <TypographyStyles />
        ...
    </>
};

Components

import * as React from 'react'
import {PrimaryButton, SecondaryButton} from "figma-ui-components"

export const Component = () => {
    return <>
        <PrimaryButton onClick={...}>Create</PrimaryButton>
        <SecondaryButton onClick={...}>Cancel</SecondaryButton>
    </>
};

Sponsored

Sponsored by Lessmess