# FigmaFlet
FigmaFlet is a tool that generates Flet UI code directly from Figma designs. It streamlines the process of transforming your Figma prototypes into production-ready Python code using the Flet framework.
## Features
- **Figma Integration**: Fetch designs directly from Figma using the file URL and API token.
- **Automatic Code Generation**: Generate Flet UI code from your designs with minimal manual effort.
- **Multi-line Text Handling**: Supports multi-line text elements seamlessly.
- **Graphical Interface**: Provides an intuitive GUI for entering API tokens, file URLs, and output paths.
## Installation
### From Source
1. Clone the repository:
```bash
git clone https://github.com/Benitmulindwa/figmaflet.git
cd figmaflet
```
2. Install the dependencies:
```bash
pip install -r requirements.txt
```
### From PyPI
```
pip install figmaflet
```
## Usage
1. Launch the GUI to interactively input your API token, file URL, and output path:
```bash
python -m figmaflet.gui
```
### How It Works
- Input your API token, file URL and output path.
- FigmaFlet fetches the design data using Figma's API token.
- The tool processes the design elements and generates Flet-compatible Python code.
- The generated code is saved to your specified output path.
2. Command-Line Interface (CLI)
Once installed, use the CLI to generate Flet code:
```bash
figmaflet --apikey YOUR_API_KEY --fileurl YOUR_FILE_URL --output YOUR_OUTPUT_PATH
```
Figma API Key
You will need your Figma API token to access design files. Generate your key by visiting your [Figma](https://figma.com) account settings.
File URL
Provide the Figma file URL containing your design; This is your figma project's URL.
## Results:
### Figma design
### Figmaflet output
## Upcoming Features
- **Images** and **Icons**
- **TextFields**
- **Buttons** + **Events handling**(eg: on_hover)
- **Fonts support**
- **Style Improvements**: better handling of **shadows**, **gradients** and other advanced figma styles
- **UI Responsivity**
- **Flexibiliy**: the generated code must be more flexible and easy to edit
- **Animations**
## Contributing
Contributions to FigmaFlet are highly welcomed!
#### To contribute:
- **Fork the repository.**
- **Create a feature branch.**
- **Submit a pull request with a detailed explanation of your changes.**
## License
This project is licensed under the Apache-2.0 License. See the LICENSE file for details.
## Author
Benit Mulindwa - [GitHub](https://github.com/benitmulindwa)
### Acknowledgments
Special thanks to the tkinterdesigner and Figma communities for their support and inspiration.
### Contact
For questions, suggestions, or feedback, feel free to open an issue or reach out to mulindwabenit@gmail.com.
Raw data
{
"_id": null,
"home_page": null,
"name": "figmaflet",
"maintainer": null,
"docs_url": null,
"requires_python": ">=3.8",
"maintainer_email": null,
"keywords": "flet, drag-and-drop, figma, ui, easy",
"author": null,
"author_email": "Benit Mulindwa <mulindwabenit@gmail.com>",
"download_url": "https://files.pythonhosted.org/packages/5a/d0/5fd58e863c0b0ef4f2162c6d4c29e47e032c74549ec80fb88ab9920682d1/figmaflet-0.0.3.tar.gz",
"platform": null,
"description": "# FigmaFlet\r\n\r\nFigmaFlet is a tool that generates Flet UI code directly from Figma designs. It streamlines the process of transforming your Figma prototypes into production-ready Python code using the Flet framework. \r\n\r\n## Features\r\n\r\n- **Figma Integration**: Fetch designs directly from Figma using the file URL and API token.\r\n- **Automatic Code Generation**: Generate Flet UI code from your designs with minimal manual effort.\r\n- **Multi-line Text Handling**: Supports multi-line text elements seamlessly.\r\n- **Graphical Interface**: Provides an intuitive GUI for entering API tokens, file URLs, and output paths.\r\n\r\n## Installation\r\n\r\n### From Source\r\n1. Clone the repository:\r\n```bash\r\ngit clone https://github.com/Benitmulindwa/figmaflet.git\r\ncd figmaflet\r\n```\r\n2. Install the dependencies:\r\n```bash\r\npip install -r requirements.txt\r\n```\r\n### From PyPI\r\n\r\n```\r\npip install figmaflet\r\n```\r\n\r\n## Usage\r\n\r\n1. Launch the GUI to interactively input your API token, file URL, and output path:\r\n\r\n```bash\r\npython -m figmaflet.gui\r\n```\r\n\r\n### How It Works\r\n- Input your API token, file URL and output path.\r\n- FigmaFlet fetches the design data using Figma's API token.\r\n- The tool processes the design elements and generates Flet-compatible Python code.\r\n- The generated code is saved to your specified output path.\r\n\r\n2. Command-Line Interface (CLI)\r\nOnce installed, use the CLI to generate Flet code:\r\n\r\n```bash\r\nfigmaflet --apikey YOUR_API_KEY --fileurl YOUR_FILE_URL --output YOUR_OUTPUT_PATH\r\n```\r\n\r\n\r\nFigma API Key\r\nYou will need your Figma API token to access design files. Generate your key by visiting your [Figma](https://figma.com) account settings.\r\n\r\n\r\nFile URL\r\nProvide the Figma file URL containing your design; This is your figma project's URL.\r\n\r\n## Results:\r\n### Figma design\r\n\r\n\r\n\r\n### Figmaflet output\r\n\r\n## Upcoming Features\r\n- **Images** and **Icons**\r\n- **TextFields**\r\n- **Buttons** + **Events handling**(eg: on_hover)\r\n- **Fonts support**\r\n- **Style Improvements**: better handling of **shadows**, **gradients** and other advanced figma styles\r\n- **UI Responsivity**\r\n- **Flexibiliy**: the generated code must be more flexible and easy to edit\r\n- **Animations**\r\n\r\n\r\n## Contributing\r\nContributions to FigmaFlet are highly welcomed! \r\n\r\n#### To contribute:\r\n\r\n- **Fork the repository.**\r\n- **Create a feature branch.**\r\n- **Submit a pull request with a detailed explanation of your changes.**\r\n## License\r\nThis project is licensed under the Apache-2.0 License. See the LICENSE file for details.\r\n\r\n## Author\r\nBenit Mulindwa - [GitHub](https://github.com/benitmulindwa)\r\n\r\n### Acknowledgments\r\nSpecial thanks to the tkinterdesigner and Figma communities for their support and inspiration.\r\n\r\n### Contact\r\nFor questions, suggestions, or feedback, feel free to open an issue or reach out to mulindwabenit@gmail.com.\r\n\r\n",
"bugtrack_url": null,
"license": "Apache-2.0 license",
"summary": "A tool to generate Flet UI from Figma designs.",
"version": "0.0.3",
"project_urls": {
"Homepage": "https://github.com/Benitmulindwa/figmaflet"
},
"split_keywords": [
"flet",
" drag-and-drop",
" figma",
" ui",
" easy"
],
"urls": [
{
"comment_text": "",
"digests": {
"blake2b_256": "163d09f0047631b9ac94a3ac230e7827e85174f0ec35f7451c43ecce8d7b2de5",
"md5": "73bd27c7402b3f592e7aa422df3ca2f7",
"sha256": "e08ff7776ea8ace4744a05eefb5752a37ba06627d41d614f4096b2c46e2e65f5"
},
"downloads": -1,
"filename": "figmaflet-0.0.3-py3-none-any.whl",
"has_sig": false,
"md5_digest": "73bd27c7402b3f592e7aa422df3ca2f7",
"packagetype": "bdist_wheel",
"python_version": "py3",
"requires_python": ">=3.8",
"size": 16683,
"upload_time": "2025-01-07T18:36:23",
"upload_time_iso_8601": "2025-01-07T18:36:23.882969Z",
"url": "https://files.pythonhosted.org/packages/16/3d/09f0047631b9ac94a3ac230e7827e85174f0ec35f7451c43ecce8d7b2de5/figmaflet-0.0.3-py3-none-any.whl",
"yanked": false,
"yanked_reason": null
},
{
"comment_text": "",
"digests": {
"blake2b_256": "5ad05fd58e863c0b0ef4f2162c6d4c29e47e032c74549ec80fb88ab9920682d1",
"md5": "ca3d9d5d340b2457021746be81badb1c",
"sha256": "744a1a2cd83f7db433f19e93ccfec15e9f7eaf6b2f21b2313138c9661361e08b"
},
"downloads": -1,
"filename": "figmaflet-0.0.3.tar.gz",
"has_sig": false,
"md5_digest": "ca3d9d5d340b2457021746be81badb1c",
"packagetype": "sdist",
"python_version": "source",
"requires_python": ">=3.8",
"size": 15112,
"upload_time": "2025-01-07T18:36:26",
"upload_time_iso_8601": "2025-01-07T18:36:26.522373Z",
"url": "https://files.pythonhosted.org/packages/5a/d0/5fd58e863c0b0ef4f2162c6d4c29e47e032c74549ec80fb88ab9920682d1/figmaflet-0.0.3.tar.gz",
"yanked": false,
"yanked_reason": null
}
],
"upload_time": "2025-01-07 18:36:26",
"github": true,
"gitlab": false,
"bitbucket": false,
"codeberg": false,
"github_user": "Benitmulindwa",
"github_project": "figmaflet",
"travis_ci": false,
"coveralls": false,
"github_actions": false,
"requirements": [
{
"name": "flet",
"specs": []
},
{
"name": "requests",
"specs": []
},
{
"name": "jinja2",
"specs": []
},
{
"name": "pillow",
"specs": []
}
],
"lcname": "figmaflet"
}
JSON
