오픈 소스. 새로운 가능성.

Front-End Checklist는 HTML, CSS, JavaScript, 성능, 접근성, SEO, 보안, 이미지, 테스팅, 개인정보, 국제화를 포함한 11개 카테고리 385개 규칙으로 구성된 오픈소스 프론트엔드 품질 시스템이다. 웹 브라우징, MCP 서버 통합, AI 에이전트 워크플로우를 지원한다.

Electron은 JavaScript, HTML, CSS로 크로스 플랫폼 데스크톱 앱을 만드는 프레임워크로, Chromium과 Node.js 기반이다.

Materialize는 Material Design 원칙을 기반으로 한 현대적인 CSS 프레임워크로, 반응형이며 시각적으로 일관된 사용자 인터페이스를 구축하기 위한 도구 세트를 제공합니다.

Pixel Art to CSS는 box-shadow와 keyframes를 활용해 픽셀 아트를 디자인하고 CSS 코드를 생성하는 React 기반 온라인 에디터입니다. 팔레트 커스터마이즈, 애니메이션 설정, 프로젝트 저장/불러오기, 정적 이미지 및 GIF 등 내보내기를 지원합니다.

Front End Interview Handbook: 인터뷰 형식, 시스템 설계, 트리비아, 코딩 질문, 기업별 질문을 다루는 프론트엔드 인터뷰 준비 자료의 오픈소스 컬렉션으로, 여러 언어로 번역되어 제공됩니다.

React 19, CoreUI React 컴포넌트 및 Vite 기반의 MIT 라이선스 무료 React 관리자 및 대시보드 템플릿입니다. AI 어시스턴트 컨텍스트 파일과 레이아웃, 라우팅, 사이드바 스켈레톤을 제공합니다.

Primer CSS는 GitHub의 Primer Design System을 CSS로 구현한 것으로, @primer/css npm 패키지로 배포됩니다. 핵심, 제품 및 마케팅 컨텍스트를 위한 유틸리티 클래스와 컴포넌트 스타일을 제공하며, 현재는 유지 관리(KTLO) 모드입니다.

Oat은 초경량(약 10KB min+gz), 의존성 없는 시맨틱 HTML/CSS/JS UI 라이브러리입니다. 프레임워크나 빌드 단계가 필요 없으며, 클래스 없이 시맨틱 태그를 문맥에 따라 스타일링하고 동적 부분에는 최소한의 JS WebComponents를 사용합니다.

기술 전반의 방대한 콘텐츠를 담은 종합 가이드로, 기술 분야 커리어에 필요한 지식을 제공하고 의문점을 해결해 줍니다.

Panda는 디자인 시스템을 위한 범용적이고 타입 안전한 CSS-in-JS 프레임워크입니다. 빌드 타임에 스타일을 추출하여 캐스케이드 레이어와 변수가 포함된 현대적인 CSS를 생성하며, 레시피와 변형을 지원하고 대부분의 JS 프레임워크와 호환됩니다.

AdminLTE는 Bootstrap 5.3과 vanilla JavaScript 기반의 MIT 라이선스 반응형 관리자 대시보드 템플릿으로, CDN, npm, Composer를 통해 설치 가능하며 React, Vue, Laravel 등 다양한 프레임워크 에디션을 제공합니다.

JavaScript, CSS, HTML용 코드 뷰티파이어로, 다양한 설정 옵션으로 코드를 재정렬하고 들여쓰기합니다. CLI 도구, Node.js 라이브러리, Python 패키지, 웹 라이브러리로 제공됩니다.

CoreUI Free Vue Admin Template은 Vue 3, Vite, CoreUI 컴포넌트를 기반으로 한 MIT 라이선스 오픈소스 대시보드 템플릿으로, AI 친화적 개발을 위한 .cursorrules, ARCHITECTURE.md, DEVELOPMENT.md 등을 제공합니다.

Dembrandt는 Playwright로 사이트 렌더링 후 DOM 스타일을 읽어 색상, 타이포그래피, 간격, 보더, 그림자, 모션, 컴포넌트를 W3C 디자인 토큰으로 변환하는 Node.js CLI입니다. CI 드리프트 게이트와 MCP를 지원합니다.

Franken UI (franken-ui/ui)는 UIkit 3를 기반으로 LitElement로 확장하고 shadcn/ui에서 영감을 받은 HTML 우선 UI 컴포넌트 라이브러리입니다. 현재 README는 0build로의 이전 안내만 포함하고 있으며, 상세 문서는 외부 사이트에서 제공됩니다.

개발자들이 실무 예제와 설명을 통해 코딩 기술을 향상시킬 수 있도록 설계된 코딩 아티클 및 스니펫 모음집입니다.

Omatsuri는 프라이버시를 중시하는 PWA로, CSS 생성기, SVG 압축기 및 JSX 변환기, Base64 인코더, 가짜 데이터 및 Lorem Ipsum 생성기를 포함한 12개의 오픈소스 프론트엔드 도구를 번들로 제공합니다. 모든 기능은 브라우저에서 오프라인 지원과 함께 실행됩니다.

Microsoft Cloud Advocates가 만든 12주, 24개 레슨의 오픈소스 웹 개발 입문 커리큘럼으로, HTML, CSS, JavaScript를 테라리움, 브라우저 확장 프로그램, 우주 게임, 뱅킹 앱 같은 실습 프로젝트로 가르칩니다.

Bulma는 Flexbox 기반의 현대적 CSS 프레임워크로, 단일 CSS 파일로 제공되며 JavaScript 없이 Sass 커스터마이징이 가능합니다.

Priceline Design System는 Priceline.com의 오픈소스 UI 컴포넌트 라이브러리이자 디자인 표준으로, 인터페이스 패턴 통합, 디자인 및 개발 가속화, 접근성·국제화·반응형 웹 설계 촉진 등을 목표로 한다.