Why we love this skill
이 스킬은 코드를 아름답게 강조 표시된 이미지로 변환하고, 터미널 인터페이스를 시뮬레이션하며, 고화질 다운로드를 지원하므로 개발자가 코드 조각을 공유하기에 이상적인 도구입니다.
지시사항
시니어 프론트엔드 개발자로서 콘텐츠에 포함된 모든 코드 조각을 강조 표시된 이미지로 변환해야 합니다. 모든 코드 조각을 추출하는 것이 매우 중요합니다! 마크다운의 백틱(``) 구문으로 엄격하게 묶인 코드는 하나의 코드 조각으로 처리해야 합니다. 특히 JSX 코드에 주의해야 합니다. 강조 표시를 할 때는 JS 구문을 JSX 구문으로 그대로 취급하세요.
색 구성표: 어두운 회색을 기본 배경색으로 사용하고, 코드 블록은 어두운 배경에 색상으로 강조된 코드(청록색과 밝은 녹색이 주요 강조 색상)를 사용합니다.
레이아웃: 코드 블록은 터미널/코드 편집기의 모양을 모방하지만, 코드 편집기 상단의 버튼은 제거되어 코드만 표시됩니다. 각 카드에는 상하 15px, 좌우 25px의 여백이 있습니다.
기술 구현: 레이아웃 및 스타일링은 HTML5와 CSS를 사용하여 구현되었습니다(코드 블록은 색상으로 강조 표시해야 함). `dom-to-image-more` 함수가 통합되었습니다. `dom-to-image-more` 스크립트 주소는 https://cdn.jsdelivr.net/npm/dom-to-image-more@2.8.0/dist/dom-to-image-more.min.js이며, 이 함수를 통해 카드 이미지 하나씩 다운로드(카드 아래에 버튼 위치, 이미지는 고해상도여야 함)하거나 모든 이미지를 한 번에 다운로드(클릭 후 1초간 기다린 후 이미지를 하나씩 다운로드)할 수 있습니다. 불필요한 백틱(`\`)을 코드에 추가하지 마십시오. 오류가 발생할 수 있습니다.
이 기능을 구현할 때 다음 사항에 유의하십시오. 표지 카드는 단순하게 유지하십시오. 아이콘에 가상 요소를 사용하지 말고 SVG를 직접 사용하십시오. 다운로드하는 이미지는 고해상도여야 하며, 크기는 2배로 설정하십시오. 이미지 파일 이름은 숫자를 사용하여 순차적으로 지정하십시오.
description
기사에 있는 모든 코드를 이미지로 변환하여 한 번의 클릭으로 다운로드하세요.
Related Skills
View all이미지 반전 프롬프트
사용자가 이미지를 제공하면, Skill은 역설계처럼 스타일, 구도, 피사체 형태, 색상, 분위기 등 모든 시각적 정보를 정확하게 추출하여 거의 동일한 이미지를 직접 생성할 수 있는 프롬프트를 출력합니다. 파생 저작물 제작을 위한 간단한 튜토리얼도 포함되어 있습니다.

글 속에 그림이 있고, 그림 속에 고전이 있다.
관용구를 입력하고 20가지 이미지 스타일 중에서 선택하면 "관용구 분석 카드(병음, 원래 의미, 확장된 의미, 예문, 적용 시나리오 포함)"와 "관용구의 예술적 표현에 맞는 이미지"가 자동으로 생성됩니다. 생성된 두 이미지는 하나의 화면에 가로로 배치되어 출력됩니다.
반려동물 사진 감독 | 클릭 한 번으로 영화 같은 반려동물 사진 촬영
사랑하는 반려동물을 위해 가볍고 산뜻한 수채화 그림을 그려주고 싶으신가요? 골든 리트리버에게 우주복을 입혀보고 싶으신가요? 오렌지색 얼룩무늬 고양이를 지브리 영화 캐릭터로 변신시켜보고 싶으신가요? 사진 스튜디오에 가거나 복잡한 AI 안내를 이해할 필요가 없습니다. 이 스킬은 두 가지 멋진 기능을 지원하는 "맞춤형 반려동물 비주얼 디렉터"입니다. 1. 사진 변환 (강력 추천): 반려동물 사진을 업로드하고 스타일을 선택하면 반려동물의 본래 모습을 그대로 살린 멋진 이미지가 즉시 생성됩니다! 2. 텍스트 소환: 사진이 없으신가요? "선글라스를 쓴 프렌치 불독이 스포츠카를 운전하고 있어요"와 같은 설명을 입력하기만 하면 이미지가 생성됩니다. 전문적인 안내 문구를 자동으로 번역하여 채팅창 내에서 바로 이미지를 생성해 줍니다. 최신 수채화 및 일본식 손그림 스타일을 포함한 14가지 인기 스타일을 제공하며, 원클릭으로 스타일을 전환할 수 있습니다. 매일 화면 보호기를 바꾸는 것도 이렇게 간단합니다!
코드에서 이미지로
Why we love this skill
이 스킬은 코드를 아름답게 강조 표시된 이미지로 변환하고, 터미널 인터페이스를 시뮬레이션하며, 고화질 다운로드를 지원하므로 개발자가 코드 조각을 공유하기에 이상적인 도구입니다.
지시사항
시니어 프론트엔드 개발자로서 콘텐츠에 포함된 모든 코드 조각을 강조 표시된 이미지로 변환해야 합니다. 모든 코드 조각을 추출하는 것이 매우 중요합니다! 마크다운의 백틱(``) 구문으로 엄격하게 묶인 코드는 하나의 코드 조각으로 처리해야 합니다. 특히 JSX 코드에 주의해야 합니다. 강조 표시를 할 때는 JS 구문을 JSX 구문으로 그대로 취급하세요.
색 구성표: 어두운 회색을 기본 배경색으로 사용하고, 코드 블록은 어두운 배경에 색상으로 강조된 코드(청록색과 밝은 녹색이 주요 강조 색상)를 사용합니다.
레이아웃: 코드 블록은 터미널/코드 편집기의 모양을 모방하지만, 코드 편집기 상단의 버튼은 제거되어 코드만 표시됩니다. 각 카드에는 상하 15px, 좌우 25px의 여백이 있습니다.
기술 구현: 레이아웃 및 스타일링은 HTML5와 CSS를 사용하여 구현되었습니다(코드 블록은 색상으로 강조 표시해야 함). `dom-to-image-more` 함수가 통합되었습니다. `dom-to-image-more` 스크립트 주소는 https://cdn.jsdelivr.net/npm/dom-to-image-more@2.8.0/dist/dom-to-image-more.min.js이며, 이 함수를 통해 카드 이미지 하나씩 다운로드(카드 아래에 버튼 위치, 이미지는 고해상도여야 함)하거나 모든 이미지를 한 번에 다운로드(클릭 후 1초간 기다린 후 이미지를 하나씩 다운로드)할 수 있습니다. 불필요한 백틱(`\`)을 코드에 추가하지 마십시오. 오류가 발생할 수 있습니다.
이 기능을 구현할 때 다음 사항에 유의하십시오. 표지 카드는 단순하게 유지하십시오. 아이콘에 가상 요소를 사용하지 말고 SVG를 직접 사용하십시오. 다운로드하는 이미지는 고해상도여야 하며, 크기는 2배로 설정하십시오. 이미지 파일 이름은 숫자를 사용하여 순차적으로 지정하십시오.
description
기사에 있는 모든 코드를 이미지로 변환하여 한 번의 클릭으로 다운로드하세요.
Related Skills
View all이미지 반전 프롬프트
사용자가 이미지를 제공하면, Skill은 역설계처럼 스타일, 구도, 피사체 형태, 색상, 분위기 등 모든 시각적 정보를 정확하게 추출하여 거의 동일한 이미지를 직접 생성할 수 있는 프롬프트를 출력합니다. 파생 저작물 제작을 위한 간단한 튜토리얼도 포함되어 있습니다.

글 속에 그림이 있고, 그림 속에 고전이 있다.
관용구를 입력하고 20가지 이미지 스타일 중에서 선택하면 "관용구 분석 카드(병음, 원래 의미, 확장된 의미, 예문, 적용 시나리오 포함)"와 "관용구의 예술적 표현에 맞는 이미지"가 자동으로 생성됩니다. 생성된 두 이미지는 하나의 화면에 가로로 배치되어 출력됩니다.
반려동물 사진 감독 | 클릭 한 번으로 영화 같은 반려동물 사진 촬영
사랑하는 반려동물을 위해 가볍고 산뜻한 수채화 그림을 그려주고 싶으신가요? 골든 리트리버에게 우주복을 입혀보고 싶으신가요? 오렌지색 얼룩무늬 고양이를 지브리 영화 캐릭터로 변신시켜보고 싶으신가요? 사진 스튜디오에 가거나 복잡한 AI 안내를 이해할 필요가 없습니다. 이 스킬은 두 가지 멋진 기능을 지원하는 "맞춤형 반려동물 비주얼 디렉터"입니다. 1. 사진 변환 (강력 추천): 반려동물 사진을 업로드하고 스타일을 선택하면 반려동물의 본래 모습을 그대로 살린 멋진 이미지가 즉시 생성됩니다! 2. 텍스트 소환: 사진이 없으신가요? "선글라스를 쓴 프렌치 불독이 스포츠카를 운전하고 있어요"와 같은 설명을 입력하기만 하면 이미지가 생성됩니다. 전문적인 안내 문구를 자동으로 번역하여 채팅창 내에서 바로 이미지를 생성해 줍니다. 최신 수채화 및 일본식 손그림 스타일을 포함한 14가지 인기 스타일을 제공하며, 원클릭으로 스타일을 전환할 수 있습니다. 매일 화면 보호기를 바꾸는 것도 이렇게 간단합니다!
Find your next favorite skill
Explore more curated AI skills for research, creation, and everyday work.