Skip to main content

📘 Introduction

Learn how to sign up and set up plugins to start using FRONT-END.AI.

FRONT-END.AI avatar
Written by FRONT-END.AI
Updated over a week ago

Thank you for using FRONT-END.AI.

Learn how to streamline your coding process with FRONT-END.AI in this guide.

FRONT-END.AI generates code using plugins for Figma and Visual Studio Code.

First, the Figma plugin allows you to export design comps and assets in one batch. Then, the VS Code plugin generates highly accurate HTML directly in your VS Code environment — in as little as 1 minute. This significantly accelerates the initial coding process.

📝 Sign up to FRONT-END.AI

  1. Start at FRONT-END.AI, Click “Get started for free”.

  2. Fill in your email address and set a password, or simply use Google/GitHub login to complete sign-up.

⚠️ Forgot your password?

  • Go to the login page and click “Forgot Password?” to reset your password.

  • Enter your email address and we will email you a link to reset your password. Please make sure to reset it before the expiration date.

⚙️Installation

The Figma plugin and the VS Code plugin are required for code generation. They help streamline the initial coding process.

🔧 Figma plugin

Click here to install the plugin.

📥 VS Code plugin

  1. Open VS Code and click the Extensions icon or press Ctrl+Shift+X (Windows/Linux) or Cmd+Shift+X (macOS).

  2. Search for "FRONT-END.AI" in the Extensions view and install it.

  3. After installing the extension, open FRONT-END.AI by clicking the icon in the sidebar.

  4. If you don’t have an account yet, please complete the sign-up process first, then click Log in.

Did this answer your question?