웹 환경에서 작동하는 자바스크립트 기반 이미지 편집 서비스를 프론트엔드로 구현할 때 활용합니다.
Develop a web-based image editor using HTML5 Canvas, CSS3, and JavaScript. Create a professional interface with tool panels and preview area. Implement basic adjustments including brightness, contrast, saturation, and sharpness. Add filters with customizable parameters and previews. Include cropping and resizing with aspect ratio controls. Implement text overlay with font selection and styling. Add shape drawing tools with fill and stroke options. Include layer management with blending modes. Support image export in multiple formats and qualities. Create a responsive design that adapts to screen size. Add undo/redo functionality with history states.
HTML5 Canvas, CSS3, JavaScript를 사용하여 웹 기반 이미지 에디터를 개발하세요. 툴 패널과 미리보기 영역이 있는 전문적인 인터페이스를 만드세요. 밝기, 대비, 채도, 선명도를 포함한 기본 조절 기능을 구현하세요. 커스텀 가능한 파라미터와 미리보기가 있는 필터를 추가하세요. 비율 조절 기능이 포함된 자르기 및 크기 조절을 포함하세요. 폰트 선택 및 스타일링이 가능한 텍스트 오버레이를 구현하세요. 채우기 및 테두리 옵션이 있는 도형 그리기 도구를 추가하세요. 블렌딩 모드가 있는 레이어 관리 기능을 포함하세요. 다양한 형식과 화질로 이미지 내보내기를 지원하세요. 화면 크기에 맞게 조율되는 반응형 디자인을 만드세요. 작업 내역 상태가 포함된 되돌리기/다시 실행 기능을 추가하세요.
출처 · prompts.chat · Image Editor — 원문은 출처에 게시된 그대로이며, 권리는 원작자에게 있습니다.
Gemini로 프롬프트를 실행해 생성한 화면입니다. 화면 안에서 직접 조작하실 수 있습니다.
HTML5 Canvas 기반으로 실시간 이미지 보정, 필터, 자르기, 텍스트 및 도형 삽입, 레이어 블렌딩 모드를 제공하는 TPI 이미지 에디터 웹 애플리케이션입니다. 데스크톱과 390px 모바일 화면 모두에서 요소 잘림과 넘침이 없도록 고도화된 반응형 레이아웃과 Undo/Redo 이력 관리 기능을 완성했습니다.
Develop a web-based image editor for TPI Studio using HTML5 Canvas, CSS3, and JavaScript. Create a professional interface with tool panels and preview area. Implement basic adjustments including brightness, contrast, saturation, and sharpness. Add filters with customizable parameters and previews. Include cropping and resizing with aspect ratio controls. Implement text overlay with font selection and styling. Add shape drawing tools with fill and stroke options. Include layer management with blending modes. Support image export in multiple formats and qualities. Create a responsive design that adapts to screen size. Add undo/redo functionality with history states.
Gemini로 실행한 결과입니다. 입력 항목에는 국내 환경의 예시값을 적용했습니다(AI 생성 — 사실 확인 필요).
Develop a web-based image editor for mopick Studio using HTML5 Canvas, CSS3, and JavaScript. Create a professional interface with tool panels and preview area. Implement basic adjustments including brightness, contrast, saturation, and sharpness. Add filters with customizable parameters and previews. Include cropping and resizing with aspect ratio controls. Implement text overlay with font selection and styling. Add shape drawing tools with fill and stroke options. Include layer management with blending modes. Support image export in multiple formats and qualities. Create a responsive design that adapts to screen size. Add undo/redo functionality with history states.
HTML5 Canvas 기반으로 실시간 이미지 보정, 필터, 자르기, 텍스트 및 도형 삽입, 레이어 블렌딩 모드를 제공하는 mopick 이미지 에디터 웹 애플리케이션입니다. 데스크톱과 390px 모바일 화면 모두에서 요소 잘림과 넘침이 없도록 고도화된 반응형 레이아웃과 Undo/Redo 이력 관리 기능을 완성했습니다.