12가지 단위 유형을 지원하는 새로운 단위 변환 계산기와 전체 사이트의 다크 모드 UI 개선 사항을 소개합니다.
updatecalculatorunit-converterdark-modeui
안녕하세요! hafuture 팀입니다.
오늘은 새롭게 추가된 단위 변환 계산기와 전체 사이트의 다크 모드 UI 개선 사항을 소개해 드리겠습니다.
1. 단위 변환 계산기 추가
일상생활과 업무에서 자주 필요한 단위 변환을 쉽고 빠르게 할 수 있는 단위 변환 계산기를 추가했습니다.
지원하는 12가지 단위 유형
- 길이 (m, km, ft, inch, mile 등)
- 무게 (kg, g, lb, oz 등)
- 면적 (㎡, 평, acre, ha 등)
- 부피 (L, mL, gallon, cup 등)
- 온도 (°C, °F, K)
- 압력 (Pa, bar, psi, atm 등)
- 속도 (m/s, km/h, mph, knot 등)
- 에너지 (J, cal, kWh, BTU 등)
- 시간 (초, 분, 시, 일, 주 등)
- 데이터 (B, KB, MB, GB, TB 등)
- 요리 (컵, 큰술, 작은술 등)
- 의류 사이즈 (S, M, L, XL 등)
주요 기능
- 실시간 변환: 값을 입력하면 즉시 변환 결과를 확인할 수 있습니다
- 빠른 입력 버튼: 자주 사용하는 값을 빠르게 입력할 수 있는 버튼 제공
- 변환 공식 표시: 어떤 공식으로 변환되는지 확인할 수 있습니다
- 완벽 가이드: 각 단위 유형별로 상세한 사용 가이드를 제공합니다
- 다국어 지원: 한국어, 영어, 일본어 모두 지원
2. 다크 모드 UI 전면 개선
사용자 경험을 향상시키기 위해 다크 모드 UI를 전면적으로 개선했습니다.
개선된 색상 체계
기존의 불투명하고 가독성이 떨어지는 다크 모드 스타일을 Zinc 색상 팔레트 기반으로 완전히 재설계했습니다.
- 카드 배경:
dark:bg-zinc-900(깔끔한 다크 그레이) - 테두리:
dark:border-zinc-700/60(은은한 구분선) - 본문 텍스트:
dark:text-zinc-100(높은 가독성) - 보조 텍스트:
dark:text-zinc-300(적절한 대비)
개선된 컴포넌트
- 푸터: 텍스트 가시성 개선 및 불투명 배경 적용
- 공지사항 카드: 투명도 제거 및 명확한 배경색 적용
- 과학 계산기: 버튼 색상 및 대비 개선
- 칼로리 계산기: 결과 표시 영역 가독성 향상
- 연락처/소개 페이지: 일관된 다크 모드 스타일 적용
단위 변환기 가이드 영역
단위 변환기의 가이드 카드는 다크 모드에서 흰색 배경으로 표시되어 내용을 더 쉽게 읽을 수 있습니다. 이는 정보 밀도가 높은 가이드 콘텐츠의 가독성을 극대화하기 위한 의도적인 디자인입니다.
3. 기타 개선 사항
- HowToUse 컴포넌트: 도구 사용 방법 안내 카드의 다크 모드 스타일 개선
- CSS 변수 활용:
--foreground,--background등 CSS 변수를 활용한 일관된 테마 적용 - 투명도 제거:
backdrop-blur,bg-white/xx등 투명 배경을 불투명 색상으로 교체하여 대비 향상
관련 도구 써보기
일상의 편리함을 더해주는 Hafuture의 도구들을 만나보세요:
hafuture는 사용자분들이 더 편리하게 도구를 활용할 수 있도록 지속적으로 개선하고 있습니다. 단위 변환이 필요하실 때 단위 변환 계산기를 활용해 보세요!
피드백이나 제안 사항은 언제든 환영합니다. 감사합니다!