figma-ui-components

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