Components AI: 새로운 생성형 디자인 시스템 탐험

Components AI는 창의적인 디자이너들을 위한 오픈소스 디자인 도구입니다. 어떤 웹 프로젝트에서도 사용할 수 있는 반응형 컴포넌트, 페이지 및 사이트를 만들 수 있습니다. 큐레이티드 테마나 자신의 디자인 토큰으로 스타일 마크업 템플릿을 만들 수 있습니다.

Studio를 통해 사용자는 시각적으로 사용자 정의 디자인 도구, 생성형 컴포넌트, 페이지 및 사이트를 설계할 수 있습니다. 또한 테마를 가져오거나 디자인 토큰을 정의하여 모든 디자인에 사용할 수 있습니다. 접근성 색상 시스템, 반응형 타입 스케일, 레이어드 박스 쉐도우 등을 만들기 위한 전용 도구가 제공됩니다.

Markdown_Publisher는 생성형 스타일과 마크다운을 결합하여 문법 강조 기능을 제공합니다. 코드 예제의 모양을 사용자 정의할 수 있습니다.

컴포넌트는 UI 및 그래픽 디자인을 위한 생성형 컴포넌트의 집합을 제공합니다. 생성된 디자인을 탐색하거나 매개변수 제어를 통해 처음부터 자신만의 디자인을 만들 수 있습니다.

디자인을 완벽하게 만들기 위해 매개변수를 조작할 수 있으며, 원하는 속성 또는 속성 조합에 대한 입력을 잠글 수 있습니다. 생성된 디자인에 투표하여 미래의 출력을 관리할 수 있고, 원하는 만큼 반복을 저장할 수 있습니다.

다양한 포맷으로 디자인을 내보낼 수 있으며, React, JS, JSON, JSX, SVG, PNG, HTML, CSS, CSS 사용자 정의 속성 및 Sass 등이 포함됩니다. 원클릭으로 디자인을 공유하여 동료나 고객과 협업할 수 있습니다.

제약 기반 디자인을 통해 컴포넌트는 사용자가 정의한 브랜드 가이드라인을 자동으로 사용하며, 필요에 따라 사용자 지정 값으로 오버라이드할 수 있습니다. 테마를 가져와 즉시 시각적 브랜드를 사용할 수 있으며, 감사 및 편집하거나 생성형 컴포넌트의 제약을 구동하는 데 사용할 수 있습니다.

자동화된 접근성 문서는 테마에서 대비 점수 및 접근 가능한 조합에 대한 빠른 시각적 피드백 루프를 제공합니다. 반응형 테마를 통해 단일 화면 크기뿐만 아니라 다양한 화면 크기에 대응하는 디자인을 쉽게 만들 수 있습니다. 1000개 이상의 폰트를 지원하며, Google Font Library 및 로컬에 설치된 모든 폰트를 사용할 수 있습니다. 변수 폰트 지원을 통해 사용자는 미세한 제어를 할 수 있습니다.

큐레이티드 디자인 자산을 탐색하여 사용자의 디자인을 사용자 정의하거나 사용할 수 있습니다.