CSS RECIPE

About

✨ The Fastest Way to Analyze Fonts, Colors, and Images

CSS RECIPE is a lightweight Chrome extension that helps you quickly inspect essential design elements of any website.
No need to open developer tools — just click the icon to extract fonts, typography styles, color palettes, and images from the page.

⸻

🔍 Key Features

✅ Font & Typography Inspector
View font family, size, weight, and line height used in body and heading tags.

✅ Color Palette Extraction
Instantly get a list of all major colors used on the page, ready to copy.

✅ Image Download Tool
See all images (assets) used on the site and download them with one click.

⸻

💡 Why CSS RECIPE?
	•	Lightweight and fast
No unnecessary clutter — just the data you need.
	•	Completely free
No login required. Use all features with no cost.
	•	Easy to use
Simple, intuitive UI that works out of the box.

⸻

👩‍💻 Ideal for:
	•	Web designers collecting quick visual references
	•	Frontend developers inspecting design decisions
	•	Marketers and PMs analyzing competitors without coding skills

⸻

🛠 How to use
	1.	Install CSS RECIPE from the Chrome Web Store
	2.	Open any website
	3.	Click the extension icon to analyze fonts, colors, and images
	4.	Copy or download what you need instantly

⸻ ⸻

✨ 쉽고 빠른 웹 디자인 분석 도구
CSS RECIPE는 웹사이트의 핵심 디자인 요소를 한눈에 확인할 수 있는 크롬 확장 프로그램입니다. 개발자 도구 없이도 body 및 heading 태그에 적용된 폰트, 타이포그래피 스타일, 컬러, 이미지를 간단하게 추출할 수 있어 디자이너와 개발자 모두에게 유용합니다.

⸻

🔍 주요 기능

✅ 폰트 & 타이포 스타일 확인
웹사이트의 본문(body) 및 제목(heading) 요소에 적용된 글꼴, 크기, 굵기, 줄 간격 등의 정보를 보여줍니다.

✅ 컬러 리스트 추출
페이지에 사용된 주요 색상들을 한 번에 확인하고 복사할 수 있습니다.

✅ 이미지 다운로드
웹페이지에 사용된 이미지(asset)를 리스트로 확인하고, 원클릭 다운로드가 가능합니다.

⸻

💡 왜 CSS RECIPE인가요?
	•	가볍고 빠릅니다.
무거운 기능 없이 필요한 정보만 정확하게 보여줍니다.
	•	완전히 무료입니다.
로그인 없이 모든 기능을 사용할 수 있습니다.
	•	누구나 쉽게 사용 가능합니다.
UI가 직관적이며, 설치 후 바로 사용할 수 있습니다.

⸻

👩‍💻 이런 분들께 추천합니다
	•	빠르게 디자인 참고자료를 수집하고 싶은 웹 디자이너
	•	경쟁사 사이트의 스타일을 분석하고 싶은 프론트엔드 개발자
	•	개발자 도움 없이 콘텐츠 구조를 파악하고 싶은 기획자/마케터

⸻

🛠 사용 방법
	1.	크롬 웹스토어에서 CSS RECIPE를 설치합니다.
	2.	분석하고 싶은 웹사이트를 엽니다.
	3.	확장 프로그램 아이콘을 클릭하면 폰트, 컬러, 이미지 정보가 자동으로 분석되어 표시됩니다.
	4.	필요한 정보는 클릭 한 번으로 복사하거나 다운로드할 수 있습니다.