CSS Box Model Visualizer, Meta Tag Checker, Regex Highlighter — 3가지 새로운 도구
발행: (2026년 3월 28일 오전 07:58 GMT+9)
2 분 소요
원문: Dev.to
Source: Dev.to
3개의 새로운 인터랙티브 도구
CSS 박스 모델 시각화 도구
인터랙티브하게 마진, 패딩, 테두리, 콘텐츠를 시각화합니다. 슬라이더를 조정하면 박스 모델이 실시간으로 업데이트됩니다. CSS를 복사할 수 있습니다.
Box Model
메타 태그 길이 검사기
Google에서 페이지가 어떻게 보이는지 미리볼 수 있습니다. 제목(30‑60자)과 설명(120‑160자)을 진행 바와 SERP 미리보기와 함께 표시합니다.
Meta Tag Checker
정규식 시각화 도구
텍스트에서 정규식 매치를 실시간으로 강조 표시합니다. 매치를 클릭하면 복사할 수 있습니다. 매치 수를 표시합니다.
Regex Visualizer
전체 툴킷 (468개 도구): devtools-site-delta.vercel.app