{"id":24907391,"url":"https://github.com/benitmulindwa/figmaflet","last_synced_at":"2025-10-16T18:31:08.302Z","repository":{"id":270490724,"uuid":"906190102","full_name":"Benitmulindwa/FigmaFlet","owner":"Benitmulindwa","description":"Generate Flet UI from Figma designs","archived":false,"fork":false,"pushed_at":"2025-01-31T19:13:12.000Z","size":175,"stargazers_count":13,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-01-31T20:22:41.793Z","etag":null,"topics":["code-generation","convert","drag-and-drop","easy","easy-to-use","fast","figma","flet","flet-gui","flet-python","python","python-library","python-script","ui","ui-design"],"latest_commit_sha":null,"homepage":"","language":"Python","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Benitmulindwa.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-12-20T10:57:54.000Z","updated_at":"2025-01-31T19:13:17.000Z","dependencies_parsed_at":"2025-01-31T20:31:20.046Z","dependency_job_id":null,"html_url":"https://github.com/Benitmulindwa/FigmaFlet","commit_stats":null,"previous_names":["benitmulindwa/figmaflet"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Benitmulindwa%2FFigmaFlet","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Benitmulindwa%2FFigmaFlet/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Benitmulindwa%2FFigmaFlet/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Benitmulindwa%2FFigmaFlet/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Benitmulindwa","download_url":"https://codeload.github.com/Benitmulindwa/FigmaFlet/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":236738581,"owners_count":19196966,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["code-generation","convert","drag-and-drop","easy","easy-to-use","fast","figma","flet","flet-gui","flet-python","python","python-library","python-script","ui","ui-design"],"created_at":"2025-02-02T01:17:07.816Z","updated_at":"2025-10-16T18:31:08.297Z","avatar_url":"https://github.com/Benitmulindwa.png","language":"Python","funding_links":["https://www.paypal.com/donate/?hosted_button_id=7L6XHBCCZL9K4"],"categories":[],"sub_categories":[],"readme":"\u003cp align=\"center\"\u003e\n  \u003cimg align=\"center\" src=\"https://github.com/user-attachments/assets/7c2116cd-b31d-464d-b024-9001292e149e\" width=200 height=200\u003e\n\u003c/p\u003e\n\n\n\u003ch1 align=\"center\"\u003e FigmaFlet \u003c/h1\u003e\n\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. \n## 🦋Support Figmaflet\nIf this project resonate with you, consider supporting its development with a donation. Your contributions will help me maintain and enhance this project. \n\n\u003ca href=\"https://www.paypal.com/donate/?hosted_button_id=7L6XHBCCZL9K4\"\u003e \n\u003cimg src=\"https://img.shields.io/badge/Donate-PayPal-blue.svg\" width=\"200\"\u003e\n\u003c/a\u003e\n\n### Thank you for your support! 💕\n\n## 🌟Features\n\n- **Figma Integration**: Fetch designs directly from Figma using the file URL and API token.\n- **Automatic Code Generation**: Generate Flet UI code from your designs with minimal manual effort.\n- **Multi-line Text Handling**: Supports multi-line text elements.\n- **Graphical Interface**: Provides an intuitive GUI for entering API tokens, file URLs, and output paths.\n- **Images**\n- **Font-families**\n- **Shadow**\n- **Gradients**:(Linear \u0026 Radial gradients)\n- **TextFields**\n- **Buttons** \n\n## 📦Installation\n\n### From Source\n1. Clone the repository:\n```bash\ngit clone https://github.com/Benitmulindwa/figmaflet.git\ncd figmaflet\n```\n2. Install the dependencies:\n```bash\npip install -r requirements.txt\n```\n### From PyPI\n\n```\npip install figmaflet\n```\n\n## 🚀Usage\n\n1. Launch the GUI to interactively input your API token, file URL, and output path:\n\n```bash\npython -m figmaflet.gui\n```\n![figmaflet_gui](https://github.com/user-attachments/assets/10ed6ffa-9deb-4e7d-94b2-11489d4ebf23)\n### 🏗️How It Works\n- Input your API token, file URL and output path.\n- FigmaFlet fetches the design data using Figma's API token.\n- The tool processes the design elements and generates Flet-compatible Python code.\n- The generated code is saved to your specified output path.\n\n2. Command-Line Interface (CLI)\nOnce installed, use the CLI to generate Flet code:\n\n```bash\nfigmaflet --apitoken YOUR_API_TOKEN --fileurl YOUR_FILE_URL --output YOUR_OUTPUT_PATH\n```\n\n#### Figma API Token\nYou will need your Figma API token to access design files. Generate your key by visiting your [Figma](https://figma.com) account settings.\n\n#### File URL\nProvide the Figma file URL containing your design; This is your figma project's URL.\n\n## 🔥Examples:\n\n![figmaOriginal](https://github.com/user-attachments/assets/054e5b07-aece-45ba-812b-4b6dceaaeb86)\n##\n![figmaflet0 0 4](https://github.com/user-attachments/assets/5fd92ffe-7c82-4f52-8dcd-85585a70d553)\n##\n![figmaflet-signup](https://github.com/user-attachments/assets/550a7dfb-ba85-4fec-8637-6a836d9a296c)\n\n\n## 🌱Upcoming Features\n- **Icons**\n- **UI Responsivity**\n- **Flexibility**: the generated code must be more flexible and easy to edit\n- **Animations**\n\n\n## 🤝🏽Contributing\nContributions to FigmaFlet are highly welcomed! \n\n#### To contribute:\n\n- **Fork the repository.**\n- **Create a feature branch.**\n- **Submit a pull request with a detailed explanation of your changes.**\n## 📜License\nThis project is licensed under the Apache-2.0 License. See the [LICENSE](LICENSE) file for details.\n\n## 📝Author\nBenit Mulindwa - [GitHub](https://github.com/benitmulindwa)\n\n### ❤️Acknowledgments\n- Special thanks to the [tkinterdesigner](https://github.com/ParthJadhav/Tkinter-Designer?tab=readme-ov-file) and [Figma](https://figma.com) communities for their support and inspiration.\n- ⭐Star this Repo: if you find it useful.\n### Contact\nFor questions, suggestions, or feedback, feel free to open an issue or reach out to mulindwabenit@gmail.com.\nConnect with me on [LINKEDIN](https://www.linkedin.com/in/benit-mulindwa-06b11122a/).\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbenitmulindwa%2Ffigmaflet","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbenitmulindwa%2Ffigmaflet","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbenitmulindwa%2Ffigmaflet/lists"}