Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

https://github.com/braposo/figma-graphql

The reimagined Figma API (super)powered by GraphQL
https://github.com/braposo/figma-graphql

api design figma figma-api graphql tools

Last synced: 3 months ago
JSON representation

The reimagined Figma API (super)powered by GraphQL

Host: GitHub
URL: https://github.com/braposo/figma-graphql
Owner: braposo
License: mit
Created: 2018-03-28T19:37:55.000Z (over 6 years ago)
Default Branch: master
Last Pushed: 2024-03-27T17:13:42.000Z (3 months ago)
Last Synced: 2024-04-14T06:06:57.367Z (3 months ago)
Topics: api, design, figma, figma-api, graphql, tools
Language: TypeScript
Homepage: https://figma-graphql.party
Size: 12.4 MB
Stars: 395
Watchers: 8
Forks: 24
Open Issues: 85
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE

Lists

awesome-figma - figma-graphql - A GraphQL connector for the Figma API. (Rest API integrations)
awesome-list - figma-graphql
awesome-stars - braposo/figma-graphql - The reimagined Figma API (super)powered by GraphQL (TypeScript)

README

        


  

    

  





figma-graphql





The reimagined [Figma API](https://www.figma.com/developers) (super)powered by GraphQL

[![Build Status][build-badge]][travis] [![Greenkeeper badge][greenkeeper-badge]][greenkeeper] [![Code Coverage][coverage-badge]][coverage] [![Known Vulnerabilities][snyk-badge]][snyk] [![All Contributors](https://img.shields.io/badge/all_contributors-4-orange.svg?style=flat-square)](#contributors) [![PRs Welcome][prs-badge]][prs] 
 ![Prettier format][prettier-badge] [![Commitizen friendly][commitizen-badge]][commitizen] [![semantic-release][semantic-badge]][semantic] [![MIT License][license-badge]][license]



## Quick start

[![Open figma-graphql][codesandbox-badge]][codesandbox]

1. Open figma-graphql [sandbox][codesandbox] and fork it

2. Add your [Figma API Token](https://www.figma.com/developers/docs#access-tokens) as `FIGMA_TOKEN` in the [codesandbox secret keys](https://codesandbox.io/docs/secrets)

3. Try your first query!

```gql

{

    file(id: "cLp23bR627jcuNSoBGkhL04E") {

        name

    }

}

```

## Documentation

Please read the [full documentation][website] for additional examples and best practices.

## Developing

1.  Clone this repo

2.  Run `yarn install` to install all dependencies

3.  Run `FIGMA_TOKEN={YOUR_PERSONAL_FIGMA_TOKEN} yarn run dev` or add it to an `.env` file

4.  The Figma GraphQL playground should be available at `http://localhost:3001/`

## Figma file

This isn't really necessary but [here's the base Figma file](https://www.figma.com/file/cLp23bR627jcuNSoBGkhL04E/Style-guide) that is being used during development.

It should work with any file so can use your own Figma files and just replace `file(id: "cLp23bR627jcuNSoBGkhL04E")` with the id of the file you want to query.

## Contributors

Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)):

  

    
_{Bernardo Raposo}
💬 💻 📖 🎨 🤔 👀 ⚠️

    
_{Sara Vieira}
💻 📖 👀

    
_{Andrey Okonetchnikov}
📖 💻

    
_{Travis Arnold}
📖

  

This project follows the [all-contributors](https://github.com/all-contributors/all-contributors) specification. Contributions of any kind welcome!

[license-badge]: https://img.shields.io/npm/l/figma-graphql.svg?style=flat-square

[license]: https://github.com/braposo/figma-graphql/blob/master/LICENSE

[prs-badge]: https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square

[prs]: http://makeapullrequest.com

[codesandbox-badge]: https://codesandbox.io/static/img/play-codesandbox.svg

[codesandbox]: https://codesandbox.io/s/github/braposo/figma-graphql/

[prettier-badge]: https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square

[build-badge]: https://img.shields.io/travis/com/braposo/figma-graphql.svg?style=flat-square

[travis]: https://travis-ci.com/braposo/figma-graphql

[coverage-badge]: https://img.shields.io/codecov/c/github/braposo/figma-graphql.svg?style=flat-square

[coverage]: https://codecov.io/github/braposo/figma-graphql

[snyk-badge]: https://snyk.io/test/github/braposo/figma-graphql/badge.svg?style=flat-square

[snyk]: https://snyk.io/test/github/braposo/figma-graphql

[commitizen-badge]: https://img.shields.io/badge/commitizen-friendly-brightgreen.svg?style=flat-square

[commitizen]: http://commitizen.github.io/cz-cli/

[semantic-badge]: https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg?style=flat-square

[semantic]: https://github.com/semantic-release/semantic-release

[greenkeeper-badge]: https://badges.greenkeeper.io/braposo/figma-graphql.svg?style=flat-square

[greenkeeper]: https://greenkeeper.io/

[website]: https://figma-graphql.party