실험적 기능: Figma to Replit 플러그인

Replit이 디자인에서 코드로의 과정을 단축하기 위해 Figma to Replit 실험적 플러그인을 공개했다. 이 도구는 Figma 디자인을 시각적으로 정확하고 반응형인 HTML, CSS, React 코드로 생성해 준다.

사용자는 Figma에서 레이어를 선택해 코드를 생성한 뒤, Export to Replit을 통해 즉시 React Repl을 만들 수 있다. 생성된 코드에는 Replit AI를 활용해 기능을 추가하거나 디자인을 다듬을 수 있으며, Static Deployments를 통해 팀과 빠르게 공유할 수 있다.

최상의 결과를 얻기 위한 권장 사항은 다음과 같다:

• 컨테이너로 그룹 대신 Frame 사용
• Auto-layout을 활용한 반응형 레이아웃 정의
• 재사용 가능한 Component 생성 및 레이어 이름 지정

다만, 현재는 실험적 단계로 몇 가지 제한 사항이 존재한다:

• HTML 태그는 div, span, svg로 제한됨
• 이미지, 그라데이션, 그림자, 변수 등은 지원되지 않음
• 기존 Replit 프로젝트와의 통합 및 컴포넌트 세트/베리언트 지원 미비