design-to-code

There are 12 repositories under design-to-code topic.

• figma-html

  BuilderIO / figma-html

  Builder.io for Figma: AI generation, export to code, import from web

  htmlfigmafigma-plugindesign-toolsdesign-systemsreacttypescriptstorybookfigma-pluginsjsx-liteno-codechrome-extensiondesign-to-codevueangularsvelte
  Language:TypeScript 2947

• imgcook / imgcook

  Generate pages from any sketch or images.

  design-to-codefrontendmachine-learning
  1810

• mostafasadeghi97 / design2code

  Convert any web design screenshot to clean HTML/CSS code

  code-generationgpt4visioncoding-assistantopenaiaidesign-to-code
  Language:TypeScript 480

• uimix-editor / uimix

  A WYSIWYG React component builder 🚧 Very work-in-progress

  cssdesign-to-codehtmljavascriptlow-codeno-codeui-componentsreact
  Language:TypeScript 425

• gridaco / code

  Design to Code Engine

  design-to-codefigmafluttercode-generationworks-with-flutterworks-with-reactworks-with-svelteworks-with-vuefigma-reactfigma-html
  Language:TypeScript 206
• figma-to-react-native

  kat-tax / figma-to-react-native

  Convert Figma Designs to React Native

  reactreact-nativedesign-to-codefigmafigma-pluginfigma-pluginscode-generationfigma-to-codedesign-toolsno-codefigma-to-react
  Language:TypeScript 169
• vscode

  BuilderIO / vscode

  Builder.io for VSCode - turn designs into code!

  nocodedesign-to-codereactvueangularsveltefigmano-code
  Language:TypeScript 168

• imgcook / imgcook-cli

  Using Imgcook force in your terminal

  design-to-code
  Language:JavaScript 58

• bricks-cloud / bricks

  Bricks is an open source tool for converting Figma designs into high-quality frontend code.

  cssdesign-to-codefigma-pluginhtmlvscode-extensionreacttailwindcss
  Language:TypeScript 57

• px2code / Figma-to-HTML

  Figma to HTML/React/Vue and truly responsive

  editorcode-generatorreactreactjsdesign-toolsfigmahtmldesign-to-codefigma-to-htmlfigma-to-codecode-generate
  Language:SCSS 33

• obvious / token-weaver

  Token Weaver is a GitHub Action to transform the Figma Token Studio tokens to platform specific theme files

  androiddesign-systemsdesign-to-codedesign-tokensgithub-actionlintingstylelint
  Language:TypeScript 8

• uznam8x / figon

  figma to html structure json

  figmahtmljsonno-codetypescriptdesign-to-codefigma-to-json
  Language:TypeScript 5

• Ritik-Saxena / Design_to_Code-Flutter

  UI design of professional designers converted in flutter code. Check out different folders for source code. For design credits, do check out README.md of a specific project folder.

  ui-to-codedesign-to-code
  Language:Dart 4
• SPA-Front

  Id-Yuu / SPA-Front

  This repo contains the results of slicing UI from Figma Project

  learn-to-codepersonal-projectreactjsresponsivefigma-to-codejavascriptlanding-pagesassdesign-to-codetailwindcssopen-sourcecontributions-welcomereact
  3

• px2code / Sketch-to-HTML

  Sketch to HTML: A online UI/Code editing tool for Smart Responsive Design

  reactsketch-to-htmlsketch-to-codereact-nativehtmldesign-to-codecss
  3

• vijita-u / Portfolio_Vijita_Uday_ReactJs

  This is my online portfolio website created using ReactJS and Framer Motion for animated elements.

  design-to-codefigmaframer-motionjsxreactjssass
  Language:JavaScript 2
• clipboard-landing

  denisdindar / clipboard-landing

  Clipboard Landin Page Challange

  landing-pagecsshtmlimage-to-htmldesign-to-codesass
  Language:HTML 1

• onyx-gen / onyx

  A Figma plugin that helps to transform Figma Design Systems to Vue components with UnoCSS utility classes.

  design-systemdesign-to-codedesign-toolsfigmafigma-exportfigma-pluginfigma-pluginsfigma-to-codeno-codetailwindtailwindcsstypescriptunocssvuepluginutility-classes
  Language:TypeScript 1

• vijita-u / EasyBank_Landing_Page

  Created a landing page for an intermediate-level Frontend Mentor challenge to enhance HTML, CSS, JS and Sass Skills while mastering the art of converting designs into code and responsive design.

  cssdesign-to-codefrontendmentor-challengehtmljavascriptresponsive-web-designsass
  Language:HTML 1
• loop-studios

  denisdindar / loop-studios

  Simple landing page

  image-to-htmldesign-to-codefront-endresponsive-designsassmixinsjavascriptcssflexbox
  Language:CSS 0
• sunnyside-agency

  denisdindar / sunnyside-agency

  Responsive landing page with SASS and pure CSS

  sasssass-mixinscssresponsivetoggleflexboxdesign-to-codeimage-to-htmldesign-to-html
  Language:CSS 0

• gunalirezqimauludi / coding-challenge-resto

  🍲 Resto Landing Page - BWA Coding Challenge Front-End Developer ( Slicing Figma to HTML & CSS Bootstrap )

  hacktoberfestdesign-to-codeslicingwebapp
  Language:HTML 0

• PChaparro / bookmark-landing-page

  Frontend mentor challenge.

  css-modulesdesign-to-codedesign-to-htmlfigma-to-htmlfrontend-mentorpsd-to-htmlnextjs
  Language:TypeScript 0

• Seylumva / fe-mentor-advice-generator

  Solution to the advice generator challenge by Frontend Mentor

  frontend-mentordesign-to-codedesign-to-html
  Language:CSS 0

• Seylumva / fe-url-shortener

  Work-in-progress solution to the URL shortening challenge by Frontend Mentor

  frontend-mentordesign-to-codedesign-to-html
  Language:HTML 0

• slimrealm / samstagram

  Clone of Instagram page (design only) -- responsive & mobile-friendly -- based on web version of IG

  design-to-codehtml5mobile-friendlyresponsive-designscss
  Language:HTML 0

• theSingingMountain / design-to-html

  A Template-to-Design of the XD Design found in this Adobe XD link: https://xd.adobe.com/view/50aa12fd-ef1f-47f9-8dc3-ec6687d3c3ed-05f9/

  adobe-xdcssdesign-to-codehtmljavascriptscss
  Language:HTML 0

• theSingingMountain / react-travel-journal

  A Travel Journal project assigned in the Scrimba course "React Basics".

  cssdesign-to-codehtmljavascriptreact-basicsreactjs
  Language:JavaScript 0

• codia-d2c / resume-template

  This repository are all kinds of excellent resume templates

  design-to-codefigma-to-codecomputer-programmer-resumesoftware-engineer-resumegoogle-resumefrontend-developer-resumefull-stack-resumeit-support-resumeui-designer-resume
  Language:CSS
• tea-cozy

  nabi-cloud / tea-cozy

  Fictional tea shop website based on a provided design spec and image assets

  restaurant-websitedesign-to-code
  Language:CSS

• nextcrafter / craft.js

  The Visual Builder for the Web

  buidercmsdesign-to-codelow-codenextjsno-codepage-buildertext-to-codeui-builderwebapp-builderwebsite-builder

• PChaparro / countries-landing-page

  REST Countries API with color theme switcher challenge from #frontendmentor.

  design-to-codefigma-to-htmlfrontend-mentorfrontendmentor-challengenextjspsd-to-htmltailwindcss
  Language:TypeScript

• RemalFatima / Urdu-Spell-Checker

  Empower software professionals with the Urdu Spell Checker. Seamlessly integrating advanced language processing, real-time spell checking, frequency analysis and error correction. Elevate accuracy and fluency in technical communication with a user-friendly interface, precise suggestions and mutant word generation.

  code-smellsdesign-patternsdesign-to-codejavajunit5solid-principlestest-case-generation
  Language:Roff

• Wabtech-B / wabtech

  Wabtech main website

  design-to-codetemplatesui-designweb-development
  Language:TypeScript

• yatang290 / food-landing-page

  A Food Landing Page

  design-to-codedesign-to-htmlfigma-to-codefigma-to-html
  Language:CSS

• yatang290 / travel-agency-landing-page

  A Travel Agency Landing Page

  design-to-codedesign-to-htmlfigma-to-codefigma-to-html
  Language:CSS