1. 키트 받기
ZIP을 풀고 preview.html을 열어 색상·폰트·컴포넌트를 확인하세요. 한글 폰트도 함께 들어 있습니다.
다른 앱도 같은 OSH 디자인으로.
osh.ai.kr의 짙은 파란색, 한글 폰트, 흰 카드와 버튼을 공유하는 공통 UI 키트입니다. 앱마다 필요한 작업 흐름에 같은 스타일을 적용하세요.
3.42 MB · 로그인 없이 다운로드 · 공개일 2026-09-19
ZIP을 풀고 preview.html을 열어 색상·폰트·컴포넌트를 확인하세요. 한글 폰트도 함께 들어 있습니다.
CSS와 폰트를 로드하고, 적용할 영역에 osh-app 클래스를 지정하세요. 기존 앱의 기능에 맞춰 화면을 구성합니다.
키트와 아래 작업 지시문을 전달하세요. 색상·폰트·박스는 공유하고 메뉴·작업 순서는 앱에 맞게 만듭니다.
#003876#E6EFFB#06264C#14243D#52627A#D6E0ED#F5F8FD#FFFFFF아래 검색은 합성 예시 3개를 브라우저 안에서만 필터링합니다.
DEMO 합성 예시 3개
| 번호 | 예시 자료 | 용도 |
|---|---|---|
| DEMO-001 | 문서 변환 예시 | 입력·결과 배치 |
| DEMO-002 | 데이터 검색 예시 | 필터·목록 배치 |
| DEMO-003 | 건강 기록 예시 | 단계·확인 배치 |
좁은 화면에서는 표 안에서 좌우로 이동할 수 있습니다.
읽기 편한 한글, 차분한 작업 화면.
안내 예시: 자료를 선택하면 다음 단계를 진행할 수 있습니다.
오류 예시: 파일 형식을 읽을 수 없습니다. 지원 형식을 확인해 주세요.
표와 문구는 디자인 확인용 예시입니다. 실제 연구자료 조회나 파일 처리를 수행하지 않습니다.
가이드·CSS·예시 HTML·한글 폰트·폰트 라이선스 전체 · 3.42 MB
28765ec92bab663d593eeb460bd22aad94f3bd61bec0533e1da29d2341e89c2b다른 앱에 적용할 공통 스타일 파일 · 7.5 KB
a2866a2358b3366fb6eda95426175c67d3ab1159785080f47d2468a918525dcf색상·글꼴·박스·버튼 규칙과 AI 작업 지시문 · 9.7 KB
1800f2400d266b7a03ce5225ccd096119b225cd232b1494054adbf39963e1802파일은 공개 저장소에서 직접 내려받습니다. 폰트의 SIL Open Font License는 ZIP의 fonts/LICENSE에 포함되어 있습니다.
공통 색상·폰트·카드·버튼의 기준을 제공합니다. React·Next.js·일반 HTML 템플릿 등에 적용할 수 있으며, 기존 앱의 CSS와 모바일 화면을 확인해 주세요. 인증·자료 접근 권한·API 기능은 각 앱에서 연결합니다.
OSH AI Hub 제작 · 버전 1.0 · 구성 예시는 DEMO로 표시합니다.