본문으로 건너뛰기
cccskills
무료GitHub에 공개

slides

Create HTML presentations for marketing, pitches, and data-driven explanations. Use Chart.js graphs, reusable design settings, responsive layouts, and writing formulas to shape slide content and choose layouts suited to the presentation's purpose.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

원문원문 설명 보기

Create strategic HTML presentations with Chart.js, design tokens, responsive layouts, copywriting formulas, and contextual slide strategies.

설치 방법 보기

이럴 때 유용합니다

  • Creating marketing presentation slides
  • Building a pitch deck
  • Explaining data with Chart.js graphs
  • Planning slide layouts and presentation wording

포함된 파일(6)

  • SKILL.md1.7 KB
  • references/copywriting-formulas.md2.5 KB
  • references/create.md153 B
  • references/html-template.md8.8 KB
  • references/layout-patterns.md3.6 KB
  • references/slide-strategies.md2.6 KB

SKILL.md(원문)

설치하기 전에 에이전트에게 전달되는 지시 내용을 확인할 수 있습니다.

Slides

Strategic HTML presentation design with data visualization.

When to Use

  • Marketing presentations and pitch decks
  • Data-driven slides with Chart.js
  • Strategic slide design with layout patterns
  • Copywriting-optimized presentation content

Subcommands

SubcommandDescriptionReference
createCreate strategic presentation slidesreferences/create.md

Script Paths

Script paths in this skill and its references/ are relative to the directory that contains this SKILL.md, not to the project: scripts/<file> is this skill's own scripts/ folder, and ../<skill>/scripts/<file> is a sibling sub-skill installed alongside it. Build the full path from that directory (Claude Code reports it as the skill's base directory when the skill loads) and keep the working directory at the project root — the scripts read and write project files such as docs/brand-guidelines.md, assets/design-tokens.json or src/ relative to it.

References (Knowledge Base)

TopicFile
Layout Patternsreferences/layout-patterns.md
HTML Templatereferences/html-template.md
Copywriting Formulasreferences/copywriting-formulas.md
Slide Strategiesreferences/slide-strategies.md

Routing

  1. Parse subcommand from $ARGUMENTS (first word)
  2. Load corresponding references/{subcommand}.md
  3. Execute with remaining arguments

리뷰

아직 리뷰가 없습니다. 사용해 본 소감을 남겨 주세요.

댓글

로그인 없이 쓸 수 있습니다. 사용 후기, 질문, 작동하지 않은 환경 등을 편하게 남겨 주세요.

아직 댓글이 없습니다. 첫 댓글을 남겨 보세요.

보내면 바로 공개됩니다. 이메일 주소나 전화번호 같은 개인 정보는 쓰지 마세요. URL은 2개까지입니다.

0 / 1,000자

이 양식은 reCAPTCHA로 보호되며 Google 개인정보처리방침 및 서비스 약관이 적용됩니다.

같은 저장소의 스킬

Create banners for social media, ads, website heroes, and print formats. Compare multiple visual directions built in HTML/CSS using supplied assets, CSS graphics, or optional generated imagery, with PNG exports when browser capture is available.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

  • Creating social media headers and covers
  • Comparing display ad banner designs
  • Designing a website hero visual
nextlevelbuilder/ui-ux-pro-max-skill13.7만2026년 10월 15일 업데이트

brand

무료

Define a brand’s tone, visual standards, and messaging, then review content and assets for consistency. Includes tools to check asset names and formats, compare colors, and convert brand guidelines into reusable design settings.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

  • Define a consistent brand tone
  • Create guidelines for colors and typography
  • Review marketing assets for brand consistency
nextlevelbuilder/ui-ux-pro-max-skill13.7만2026년 10월 15일 업데이트

design

무료

Create logos, business card mockups, HTML presentations, banners, social images, and SVG icons. Define shared brand colors and typography, then carry those choices into visual assets and interface styling.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

  • Create logos and business card mockups
  • Design social images for multiple platforms
  • Build pitch decks in HTML
nextlevelbuilder/ui-ux-pro-max-skill13.7만2026년 10월 15일 업데이트

Organize colors, spacing, and typography into reusable design tokens, or shared style values. Generate CSS variables, define component states, check for hardcoded values, and create HTML presentations that follow the same brand rules.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

  • Standardize colors, spacing, and typography
  • Document button states and variants
  • Check code for hardcoded style values
nextlevelbuilder/ui-ux-pro-max-skill13.7만2026년 10월 15일 업데이트

Build accessible interfaces with shadcn/ui components and Tailwind CSS styling. Create forms, tables, and layouts that adapt to screen size, then coordinate colors, spacing, and dark mode across the application.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

  • Build forms with keyboard navigation
  • Adapt layouts for phones and desktops
  • Unify colors and dark mode
nextlevelbuilder/ui-ux-pro-max-skill13.7만2026년 10월 15일 업데이트

Search local design guidance to plan, build, review, or improve web, mobile, and desktop interfaces. Find suitable colors, font pairings, layouts, charts, and interaction patterns, with implementation advice matched to the project's technology.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

  • Choose colors and fonts for a new product
  • Review forms and keyboard accessibility
  • Fix layouts that break on small screens
nextlevelbuilder/ui-ux-pro-max-skill13.7만2026년 10월 15일 업데이트

nextlevelbuilder의 스킬 모두 보기

이 스킬의 문제 신고