# ㉔ 배경·버튼·레이아웃 비주얼 조정. Claude Code로 운세 보기

> https://bookfactory.kr/c/canva/10438
> 게시판: Canva
> 작성자: admin
> 작성일: 2026-08-23T00:28:42.723Z

---

![見出し画像](https://assets.st-note.com/production/uploads/images/305619072/rectangle_large_type_2_942d863e218de9aeb32a6eea248ede9d.png?width=1280)

## 배경 이미지를 스크롤해도 움직이지 않도록 하고 싶다

연출이 확정된 뒤, 이번에는 외관의 세부 사항을 다듬기로 했습니다. 배경에 사용할 요리 사진과 버튼용 일러스트는 미리 Canva에서 준비해 두었습니다.

아마추어 AI 배경을 Canva로 만든 이 이미지로 변경하고, 스크롤해도 고정되도록 해주세요.

![画像](https://assets.st-note.com/img/1787301252-HdJ9VtMg7jRWfiErkOu8mwzl.png?width=1200)

그리고 설명문이 중간에 부자연스럽게 줄바꿈되어 있으니 한 줄로 합쳐주세요.

ClaudeCode가 지정한 이미지를 배경으로 설정하고, background-attachment: fixed(스크롤해도 배경만 그 자리에 고정되는 지정)로 고정합니다. 설명 문구도 줄바꿈 없이 한 줄로 조정합시다.

## 버튼도 지정한 이미지로 교체하고 싶다

시로우토 AI의 ‘점치기’ 버튼도 제가 Canva로 만든 이미지로 교체해 주실 수 있을까요?

![画像](https://assets.st-note.com/img/1787301338-Bts73gOAny2aKp1SjGZPWTJi.png)

그리고 초록색 테두리를 조금 더 넓혀서 배경이 살짝 보이도록 하고 싶습니다.

ClaudeCode님 버튼을 지정된 일러스트 이미지로 교체합니다. 카드 너비도 640px에서 780px로 넓히고, 배경이 은은하게 비쳐 보이는 프로스티드 글라스풍 디자인으로 변경하겠습니다.

## 하나하나의 요청이 그대로 형태가 되어 간다.

초보 AI의 불투명 유리 풍인데, 상상했던 것보다 꽤 괜찮네요.

Canva에서 만든 소재와 Claude Code로 구현한 부분을 잘 조합한 덕분에 시각적 완성도가 꾸준히 높아졌습니다.

조금 더 이어집니다… 다음 편 완결입니다.

**출처:** [note 원문](https://note.com/shiro_to_ai/n/n728164056943)

*번역: Gemma 3(.44) 초벌 + 교정 8청크*

[원문 보기](https://note.com/shiro_to_ai/n/n728164056943) | 출처: note.com