웹페이지 색을 추출할 때 공식 팔레트와 구분하기.
실제로 표시된 스타일에서 색상을 추출하고 역할을 적으세요. 눈에 띄는 강조색이 브랜드에서 승인한 유일한 색상은 아닐 수 있습니다.
작업에 맞게 절차를 조정하세요.
선택한 요소를 살펴보고 텍스트, 테두리, 배경처럼 눈에 보이는 역할과 색을 기록하세요. 계산된 CSS 값과 이미지에서 샘플링한 색을 구분하세요. 요소 참조를 남기고 살핀 페이지 상태나 테마를 밝히세요.
- 제공할 내용
- 선택한 페이지의 눈에 보이는 스타일.
- 받을 결과
- 사용된 색상과 역할, 출처 요소.
입력과 결과를 확인하세요.
설명용 입력과 출력 · 실제 WebAct 실행이 아닌 학습용 예시
입력 항목 예시개
Supplied style inspection: .card background #ffffff; button.primary background #d97736. These are inspected values, not official brand guidelines.
완성된 예시
.card — role: card background — color: #ffffff button.primary — role: primary-button background — color: #d97736 Scope: two supplied element styles. Hover states, theme variants and brand approval are not established by this sample.
이 입력을 프롬프트에 넣고 WebAct에 복사해 작업을 실행해 보세요. 결과는 설명용 예시와 다를 수 있습니다.
판단 기준과 문제 해결.
한 페이지에서 추출한 색을 공식 브랜드 팔레트로 봐도 되나요?
그 색은 검사한 페이지만 설명합니다. 브랜드 규칙, 접근 가능한 색 조합, 승인된 변형에는 별도 문서가 필요합니다.
버튼에 마우스를 올리면 색이 달라지는 이유는 무엇인가요?
상호작용 상태가 기본 스타일을 덮어쓸 수 있습니다. 쓸 수 있는 팔레트를 만들려면 값과 함께 상태를 기록하세요.
직접 준비한 자료로 시도하세요.
작업 프롬프트의 예시를 내 자료로 바꾸세요. 필요한 요구 사항은 유지하고 작업을 WebAct에 복사하세요.
작업 맞춤 설정 및 복사 ↑