numl

Numl은 런타임 CSS 생성을 지원하는 Web Components 기반의 원자적 UI 프레임워크로, 디자인 시스템을 따르는 인터페이스를 신속하게 구축하는 것을 목표로 합니다. README에는 이 프로젝트가 더 이상 유지 관리되지 않는 deprecated 상태라는 공지가 명시되어 있으며, 후속 프로젝트로 React용 CSS-in-JS 스타일링 시스템 및 DSL인 tasty와 WCAG 대비 해결 기능을 갖춘 OKHSL 색상 테마 생성기인 glaze가 제안되었습니다. 제공 기능: UI 디자인 언어, 즉시 사용 가능한 접근성 웹 컴포넌트 라이브러리, 그리고 런타임 CSS 프레임워크를 제공합니다. README에 따르면 페이지에 JavaScript 모듈 하나만 추가하면 번들러나 설정 없이 nu-btn과 같은 요소를 마크업에서 직접 사용할 수 있습니다. 설치 및 사용: README에서는 jsDelivr에서 ES 모듈 빌드를 로드한 후 일반 HTML로 요소를 작성하는 방법을 보여줍니다. 다른 설치 방법은 핸드북에 문서화되어 있습니다. 주요 특징: 반응형 인터페이스를 위한 마크업과 사용자 정의 가능한 접근성 요소를 결합한 올인원 접근 방식, 일반 CSS보다 스타일 선언을 줄일 수 있는 색상 생성 시스템 및 styles-to-state 바인딩, 자동 다크 스킴 및 고대비 모드, 커스텀 속성으로 노출되는 디자인 토큰, 전역/컨텍스트/요소 직접 지정 방식의 커스터마이징, 커스텀 요소/스타일 속성/동작/디자인 토큰/커스텀 단위 추가 기능, 그리고 Vue, Angular, React, Svelte와 같은 프레임워크 및 SSG와의 호환성을 갖추고 있습니다. 문서 및 예제: README는 numl.design의 Storybook, Handbook, Reference 및 REPL을 안내합니다. 예제로는 flex 및 grid 플레이그라운드, 마크다운 변환기, before/after 슬라이더, 로그인 폼 유효성 검사 등이 포함됩니다. Numl로 구축된 프로젝트로는 Cube.js UI Kit와 여러 Numl 웹사이트 및 스토리북이 언급됩니다. 브라우저 지원: Edge, Chrome, Firefox, Safari, iOS Safari 및 Android의 최신 두 버전까지 지원합니다. IE11 및 pre-Chromium Edge는 프로젝트 범위에서 명시적으로 제외됩니다. 개발 명령어: npm start는 플레이그라운드를 실행하고, npm run build는 라이브러리를 dist 폴더에 ES6 tree-shaking 친화적 모듈로 빌드하며, npm run dev는 소스 변경 시 재빌드하고, npm run test는 테스트를 실행합니다. 이 프로젝트는 MIT 라이선스를 따르며 all-contributors 사양을 준수합니다. README는 기여를 권장하며 Discord 커뮤니티 링크를 제공합니다. 로드맵 섹션에는 v2 style2state 구문 제안, React 라이브러리, 테마 생성기, 추가 문서 및 테스트, Figma UI 키트 등이 언급되어 있으나, 저장소가 deprecated 상태이므로 이러한 계획은 과거의 기록으로 이해해야 합니다.