https://github.com/candidosales/figma-format-code
A Figma plugin designed to allow you to format and syntax highlight code
https://github.com/candidosales/figma-format-code
code figma highlight plugin
Last synced: about 1 month ago
JSON representation
A Figma plugin designed to allow you to format and syntax highlight code
- Host: GitHub
- URL: https://github.com/candidosales/figma-format-code
- Owner: candidosales
- License: mit
- Created: 2020-09-27T05:50:57.000Z (over 5 years ago)
- Default Branch: main
- Last Pushed: 2024-07-17T02:10:31.000Z (over 1 year ago)
- Last Synced: 2025-03-25T07:41:36.079Z (12 months ago)
- Topics: code, figma, highlight, plugin
- Language: CSS
- Homepage: https://www.figma.com/community/plugin/891351519501239645/Format-Code
- Size: 19.7 MB
- Stars: 9
- Watchers: 2
- Forks: 2
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Funding: .github/FUNDING.yml
- License: LICENSE
Awesome Lists containing this project
README
# Format Code
Format Code makes it easy to format code snippets and add a theme for syntax highlight.
## Features
- Syntax highlighting powered by Shiki;
- 23 beautiful themes to choose from;
- Font selection with Google Fonts support for monospace fonts;
- Automatic language detection;
- Code formatting with Prettier;
- Line numbers supports;
Design & Developed by Cândido Sales.
## Preview
## Languages supported
- CSS;
- HTML;
- It has a known issue with `` tags. I'm still investigating how to fix it;
- Go;
- GraphQL;
- Java;
- Javascript;
- JSON;
- Haskell;
- Kotlin;
- Less;
- Lua;
- Markdown;
- Python;
- Ruby;
- Rust;
- SCSS;
- Typescript;
- YAML;
## Themes supported
- Ayu Dark;
- Catppuccin Latte;
- Catppuccin Mocha;
- Dark Plus;
- Dracula;
- GitHub Dark;
- GitHub Light;
- Light Plus;
- Material Darker;
- Material Ocean;
- Material Palenight;
- Min Dark;
- Min Light;
- Monokai;
- Nord;
- One Dark Pro;
- One Light;
- Rose Pine;
- Solarized Dark;
- Solarized Light;
- Tokyo Night;
- Vitesse Dark;
- Vitesse Light;
## 📚 Reference
- https://github.com/figma/plugin-samples
- https://github.com/yuanqing/create-figma-plugin
- https://github.com/shikijs/shiki
- https://github.com/teknologi-umum/flourite
- https://github.com/thomas-lowry/themer
- https://github.com/oriziv/figma-sass-less-plugin
- https://prettier.io/docs/en/options.html#parser
## 👍 Contribute
If you want to say thank you and/or support the active development this project:
1. Add a [GitHub Star](https://github.com/candidosales/figma-format-code/stargazers) to the project.
2. Tweet about the project [on your Twitter](https://twitter.com/intent/tweet?url=https%3A%2F%2Fgithub.com%2Fcandidosales%2Ffigma-format-code%20&via=candidosales&text=A%20Figma%20plugin%20designed%20to%20allow%20you%20to%20format%20and%20syntax%20highlighting%20code).
3. Write a review or tutorial on [Medium](https://medium.com/), [Dev.to](https://dev.to/) or personal blog.
4. Support the project by donating a [cup of coffee](https://buymeacoff.ee/candidosales).
## ☕ Supporters
If you want to support Format Code, you can ☕ [**buy a coffee here**](https://buymeacoff.ee/candidosales)
| | User | Donation |
| :-------------------------------------------------------- | :----------------------------------- | :------- |
|  | [@g0dkar](https://github.com/g0dkar) | ☕ x 5 |
## ✨ Acknowledgment
- 😯
## Author
- Cândido Sales - [@candidosales](https://twitter.com/candidosales)
## ⚠️ Copyright and license
Code and documentation copyright 2026-2036 the [Authors](https://github.com/candidosales/figma-format-code/graphs/contributors) and Code released under the [MIT License](https://github.com/candidosales/figma-format-code/blob/master/LICENSE). Docs released under [Creative Commons](https://creativecommons.org/licenses/by/3.0/).