{"id":14256936,"url":"https://github.com/onlook-dev/onlook","last_synced_at":"2025-05-14T12:06:59.207Z","repository":{"id":246096147,"uuid":"820087727","full_name":"onlook-dev/onlook","owner":"onlook-dev","description":"The open source Cursor for Designers. Design directly in your live React app and publish your changes to code.","archived":false,"fork":false,"pushed_at":"2025-05-04T12:56:50.000Z","size":47368,"stargazers_count":9386,"open_issues_count":252,"forks_count":578,"subscribers_count":41,"default_branch":"main","last_synced_at":"2025-05-07T11:41:51.646Z","etag":null,"topics":["browser","cursor","design","devtool","electron","figma","frontend","hacktoberfest","ide","local-first","low-code","nextjs","no-code","react","tailwindcss","typescript","ui","vitejs","webflow"],"latest_commit_sha":null,"homepage":"https://onlook.com","language":"TypeScript","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/onlook-dev.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE.md","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":"SECURITY.md","support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2024-06-25T19:16:02.000Z","updated_at":"2025-05-07T11:11:29.000Z","dependencies_parsed_at":"2024-09-14T02:35:51.611Z","dependency_job_id":"f6f650bf-6cd7-40d8-bbd9-94b6289bb90e","html_url":"https://github.com/onlook-dev/onlook","commit_stats":{"total_commits":173,"total_committers":17,"mean_commits":"10.176470588235293","dds":"0.23121387283236994","last_synced_commit":"09b396f0a17673c2d3a49537d4f96ff1bad31021"},"previous_names":["onlook-dev/browser","onlook-dev/onlook","onlook-dev/studio"],"tags_count":165,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/onlook-dev%2Fonlook","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/onlook-dev%2Fonlook/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/onlook-dev%2Fonlook/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/onlook-dev%2Fonlook/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/onlook-dev","download_url":"https://codeload.github.com/onlook-dev/onlook/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254140741,"owners_count":22021218,"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":["browser","cursor","design","devtool","electron","figma","frontend","hacktoberfest","ide","local-first","low-code","nextjs","no-code","react","tailwindcss","typescript","ui","vitejs","webflow"],"created_at":"2024-08-22T07:01:35.102Z","updated_at":"2025-05-14T12:06:59.150Z","avatar_url":"https://github.com/onlook-dev.png","language":"TypeScript","readme":"\u003c!-- Improved compatibility of back to top link: See: https://github.com/othneildrew/Best-README-Template/pull/73 --\u003e\n\n\u003ca id=\"readme-top\"\u003e\u003c/a\u003e\n\n![image](https://github.com/user-attachments/assets/7b787ac7-96cd-44fd-90da-46996e1e1bf5)\n\n\u003cdiv align=\"center\"\u003e\n\u003ch3 align=\"center\"\u003eOnlook\u003c/h3\u003e\n  \u003cp align=\"center\"\u003e\n    Cursor for Designers\n    \u003cbr /\u003e\n    \u003ca href=\"https://github.com/onlook-dev/onlook/wiki\"\u003e\u003cstrong\u003eExplore the docs »\u003c/strong\u003e\u003c/a\u003e\n    \u003cbr /\u003e\n    \u003cbr /\u003e\n    \u003ca href=\"https://youtu.be/RSX_3EaO5eU?feature=shared\"\u003eView Demo\u003c/a\u003e\n    ·\n    \u003ca href=\"https://github.com/onlook-dev/onlook/issues/new?labels=bug\u0026template=bug-report---.md\"\u003eReport Bug\u003c/a\u003e\n    ·\n    \u003ca href=\"https://github.com/onlook-dev/onlook/issues/new?labels=enhancement\u0026template=feature-request---.md\"\u003eRequest Feature\u003c/a\u003e\n  \u003c/p\u003e\n  \u003c!-- PROJECT SHIELDS --\u003e\n\u003c!--\n*** I'm using markdown \"reference style\" links for readability.\n*** Reference links are enclosed in brackets [ ] instead of parentheses ( ).\n*** See the bottom of this document for the declaration of the reference variables\n*** for contributors-url, forks-url, etc. This is an optional, concise syntax you may use.\n*** https://www.markdownguide.org/basic-syntax/#reference-style-links\n--\u003e\n\u003c!-- [![Contributors][contributors-shield]][contributors-url]\n[![Forks][forks-shield]][forks-url]\n[![Stargazers][stars-shield]][stars-url]\n[![Issues][issues-shield]][issues-url]\n[![Apache License][license-shield]][license-url] --\u003e\n\n[![Discord][discord-shield]][discord-url]\n[![LinkedIn][linkedin-shield]][linkedin-url]\n[![Twitter][twitter-shield]][twitter-url]\n[![Weave][weave-shield]][weave-url]\n\n\u003c/div\u003e\n\n\u003c!-- TABLE OF CONTENTS --\u003e\n\u003cdetails\u003e\n  \u003csummary\u003eTable of Contents\u003c/summary\u003e\n  \u003col\u003e\n    \u003cli\u003e\u003ca href=\"#installation\"\u003eInstallation\u003c/a\u003e\u003c/li\u003e\n    \u003cli\u003e\u003ca href=\"#usage\"\u003eUsage\u003c/a\u003e\u003c/li\u003e\n    \u003cli\u003e\u003ca href=\"#roadmap\"\u003eRoadmap\u003c/a\u003e\u003c/li\u003e\n    \u003cli\u003e\u003ca href=\"#contributing\"\u003eContributing\u003c/a\u003e\u003c/li\u003e\n    \u003cli\u003e\u003ca href=\"#contact\"\u003eContact\u003c/a\u003e\u003c/li\u003e\n    \u003cli\u003e\u003ca href=\"#acknowledgments\"\u003eAcknowledgments\u003c/a\u003e\u003c/li\u003e\n    \u003cli\u003e\u003ca href=\"#license\"\u003eLicense\u003c/a\u003e\u003c/li\u003e\n  \u003c/ol\u003e\n\u003c/details\u003e\n\n# The open-source Cursor for Designers\n\nSeamlessly integrate with any website or web app running on React + TailwindCSS, and make live edits directly in the browser DOM. Customize your design, control your codebase, and push your changes without compromise.\n\n\n\nhttps://github.com/user-attachments/assets/c8782d1e-fedc-46f3-8735-c3a762d4db16\n\n\n\n![Onlook-GitHub-Example](https://github.com/user-attachments/assets/642de37a-72cc-4056-8eb7-8eb42714cdc4)\n\n\n### Built With\n\n-   [![React][React.js]][React-url]\n-   [![Electron][Electron.js]][Electron-url]\n-   [![Tailwind][TailwindCSS]][Tailwind-url]\n-   [![Vite][Vite.js]][Vite-url]\n\n## Stay up-to-date\n\nOnlook officially launched our first version of Onlook on July 08, 2024 and we've shipped a ton since then. Watch releases of this repository to be notified of future updates, and you can follow along with us on [LinkedIn](https://www.linkedin.com/company/onlook-dev) or [Substack](https://onlook.substack.com/) where we write a weekly newsletter.\n\n\u003c!-- ![Starproject](https://github.com/user-attachments/assets/07742b21-dd98-4be3-b6a6-13d8132af398) --\u003e\n\n## Getting Started\n\n![image](https://github.com/user-attachments/assets/18b6ad5a-1d5a-4396-af8c-8b85936acf39)\n\n### Installation\n\n 1. Visit [onlook.com](https://onlook.com/) to download the app.\n 2. Run locally following [this guide](https://github.com/onlook-dev/onlook/wiki/Building-from-source)\n\n### Usage\n\nOnlook will run on any React project, bring your own React project or create one using Onlook\n\n\u003cimg width=\"676\" alt=\"Screenshot 2024-11-27 at 9 36 47 AM\" src=\"https://github.com/user-attachments/assets/ec5c9bb2-7d0a-4754-962e-5d0c9fe0d706\"\u003e\n\nUse the chat to create or edit a project you're working on. At any time, you can always right-click an element to open up the exact location of the element in code. Just be sure to choose your preferred IDE in the upper-right Corner of the screen.\n\n\u003cimg width=\"600\" alt=\"image\" src=\"https://github.com/user-attachments/assets/4ad9f411-b172-4430-81ef-650f4f314666\" /\u003e\n\n\u003cimg width=\"403\" alt=\"image\" src=\"https://github.com/user-attachments/assets/44339458-05a7-46c3-b4f8-b7e125260216\" /\u003e\n\n\n## Roadmap\n\n![image](https://github.com/user-attachments/assets/f64b51df-03be-44d1-ae35-82e6dc960d06)\n\nSee how we're tracking towards major [milestones](\u003c[url](https://github.com/onlook-dev/onlook/milestones)\u003e), and read the [wiki](https://github.com/onlook-dev/onlook/wiki/Roadmap) for details on each version of Onlook. Here's a rough overview of some of the major features we're looking at:\n\n-   [x] Browser\n-   [x] Editor\n-   [x] Write-to-code\n-   [X] AI chat\n-   [ ] Variables\n-   [ ] Components\n-   [ ] Hosting\n\nAlso check the [open issues](https://github.com/onlook-dev/onlook/issues) for a full list of proposed features (and known issues).\n\n## Contributing\n\n![image](https://github.com/user-attachments/assets/ecc94303-df23-46ae-87dc-66b040396e0b)\n\nIf you have a suggestion that would make this better, please fork the repo and create a pull request. You can also [open issues](https://github.com/onlook-dev/onlook/issues).\n\nSee the [CONTRIBUTING.md](CONTRIBUTING.md) for instructions and code of conduct.\n\n#### Contributors\n\n\u003ca href=\"https://github.com/onlook-dev/onlook/graphs/contributors\"\u003e\n  \u003cimg src=\"https://contrib.rocks/image?repo=onlook-dev/onlook\u0026t=1\" /\u003e\n\u003c/a\u003e\n\n## Contact\n\n![image](https://github.com/user-attachments/assets/60684b68-1925-4550-8efd-51a1509fc953)\n\n-   Team: [Discord](https://discord.gg/hERDfFZCsH) - [Twitter](https://twitter.com/onlookdev) - [LinkedIn](https://www.linkedin.com/company/onlook-dev/) - [Email](mailto:contact@onlook.com)\n-   Project: [https://github.com/onlook-dev/onlook](https://github.com/onlook-dev/onlook)\n-   Website: [https://onlook.com](https://onlook.com)\n\n## Acknowledgments\n\nProjects we're inspired by:\n\n-   [Visbug](https://github.com/GoogleChromeLabs/ProjectVisBug)\n-   [Responsively](https://github.com/responsively-org/responsively-app)\n-   [Supabase](https://github.com/supabase/supabase)\n-   [ShadCN](https://github.com/shadcn-ui/ui)\n-   [hymhub/css-to-tailwind](https://github.com/hymhub/css-to-tailwind)\n\n## License\n\nDistributed under the Apache 2.0 License. See [LICENSE.md](LICENSE.md) for more information.\n\n\u003c!-- https://www.markdownguide.org/basic-syntax/#reference-style-links --\u003e\n\n[contributors-shield]: https://img.shields.io/github/contributors/onlook-dev/studio.svg?style=for-the-badge\n[contributors-url]: https://github.com/onlook-dev/onlook/graphs/contributors\n[forks-shield]: https://img.shields.io/github/forks/onlook-dev/studio.svg?style=for-the-badge\n[forks-url]: https://github.com/onlook-dev/onlook/network/members\n[stars-shield]: https://img.shields.io/github/stars/onlook-dev/studio.svg?style=for-the-badge\n[stars-url]: https://github.com/onlook-dev/onlook/stargazers\n[issues-shield]: https://img.shields.io/github/issues/onlook-dev/studio.svg?style=for-the-badge\n[issues-url]: https://github.com/onlook-dev/onlook/issues\n[license-shield]: https://img.shields.io/github/license/onlook-dev/studio.svg?style=for-the-badge\n[license-url]: https://github.com/onlook-dev/onlook/blob/master/LICENSE.txt\n[linkedin-shield]: https://img.shields.io/badge/-LinkedIn-black.svg?logo=linkedin\u0026colorB=555\n[linkedin-url]: https://www.linkedin.com/company/onlook-dev\n[twitter-shield]: https://img.shields.io/badge/-Twitter-black?logo=x\u0026colorB=555\n[twitter-url]: https://x.com/onlookdev\n[discord-shield]: https://img.shields.io/badge/-Discord-black?logo=discord\u0026colorB=555\n[discord-url]: https://discord.gg/hERDfFZCsH\n[React.js]: https://img.shields.io/badge/react-%2320232a.svg?logo=react\u0026logoColor=%2361DAFB\n[React-url]: https://reactjs.org/\n[TailwindCSS]: https://img.shields.io/badge/tailwindcss-%2338B2AC.svg?logo=tailwind-css\u0026logoColor=white\n[Tailwind-url]: https://tailwindcss.com/\n[Electron.js]: https://img.shields.io/badge/Electron-191970?logo=Electron\u0026logoColor=white\n[Electron-url]: https://www.electronjs.org/\n[Vite.js]: https://img.shields.io/badge/vite-%23646CFF.svg?logo=vite\u0026logoColor=white\n[Vite-url]: https://vitejs.dev/\n[product-screenshot]: assets/brand.png\n[weave-shield]: https://img.shields.io/endpoint?url=https%3A%2F%2Fapp.workweave.ai%2Fapi%2Frepository%2Fbadge%2Forg_pWcXBHJo3Li2Te2Y4WkCPA33%2F820087727\u0026cacheSeconds=3600\u0026labelColor=#131313\n[weave-url]: https://app.workweave.ai/reports/repository/org_pWcXBHJo3Li2Te2Y4WkCPA33/820087727\n","funding_links":[],"categories":["TypeScript","Table of Contents","HarmonyOS","Repos","browser","AI Code Editors \u0026 IDEs","ai"],"sub_categories":["Code Editor","Windows Manager"],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fonlook-dev%2Fonlook","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fonlook-dev%2Fonlook","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fonlook-dev%2Fonlook/lists"}