그라데이션 화면
화면 전체를 그라데이션으로 채워요. 색을 두세 가지 고르고 각도를 바꾸거나 방사형 그라데이션으로 바꿀 수 있어요. 버튼 하나로 전체화면이 되고, 화면 크기에 맞춰 배경화면으로 다운로드할 수도 있어요.
더블클릭하거나 F를 누르면 전체화면이 돼요135° · #FF7E5F → #FEB47B
단축키
- F
- 전체화면
- Esc
- 전체화면 종료
- ← →
- 45도 회전
- ↑ ↓
- 프리셋 바꾸기
- H
- 컨트롤 바 표시 또는 숨기기
- S
- PNG 다운로드
색과 이미지는 모두 브라우저 안에서 만들어지고, 아무것도 업로드되지 않아요.
색
CSS 코드
background: linear-gradient(135deg, #FF7E5F 0%, #FEB47B 100%);그라데이션 화면은 어디에 쓸 수 있을까요?
- 휴대폰이나 컴퓨터 배경화면: 색을 맞춘 다음 PNG로 다운로드하세요. 크기는 이 화면, 1920 × 1080, 4K, 휴대폰 세로 중에서 고를 수 있어요.
- 무드등: 방 불을 끄고 태블릿이나 TV에 노을, 오로라 같은 은은한 그라데이션을 띄우면 단색보다 깊이감이 있어요.
- 사진과 라이브 방송 배경: 화면을 상품이나 사람 뒤에 두면 카메라에 색이 자연스럽게 변하는 배경이 담겨요.
- 밴딩 확인: ‘검정에서 흰색’을 고르고 그라데이션이 매끄럽게 이어지는지 보세요. 줄무늬 같은 띠가 보인다면 모니터, 그래픽카드, 색상 설정 때문일 수 있어요.
그라데이션 예쁘게 맞추는 법
같은 계열에 밝기가 비슷한 두 색이 가장 부드러워요. 예를 들면 연핑크와 핑크예요. 색 차이가 너무 크면 가운데에 칙칙한 회색 구간이 생기기 쉬운데, 중간색을 하나 넣으면 더 자연스럽게 이어져요.
각도 90도는 왼쪽에서 오른쪽, 180도는 위에서 아래예요. 방사형 그라데이션은 가운데에서 바깥으로 퍼져서 스포트라이트 느낌의 배경으로 좋아요.
사용 방법
- 프리셋을 고르거나 색을 직접 고른 다음, 그라데이션 종류와 각도를 맞추고 필요하면 타이머를 설정하세요.
- ‘전체화면’ 버튼을 누르거나, F를 누르거나, 화면을 더블클릭하세요.
- 나갈 때는 Esc를 누르세요. 휴대폰에서는 화면을 한 번 탭해서 컨트롤 바를 띄운 다음 ‘나가기’를 누르세요.
iPhone의 Safari는 웹페이지 전체화면을 지원하지 않아서 창 전체를 채우는 방식으로 보여 줘요. 주소창까지 완전히 없애고 싶다면 먼저 ‘홈 화면에 추가’한 뒤 열어 보세요.