본문으로 건너뛰기
cccskills

OpenDesign

@nexu-io

조직

The open-source stack for your design system.

스킬 669개저장소 14개 12.4만

스킬(669)

검색에서 좁히기

docs-page

무료

Build a three-column page for API documentation or tutorials, with section navigation, article content, and a table of contents. The layout includes copyable code blocks, highlighted notices, search, version display, and theme switching.

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

  • Creating an API documentation page
  • Laying out a tutorial with code examples
  • Organizing a long technical guide with navigation
nexu-io/html-anything9.2천2026년 10월 13일 업데이트

Design a two-page digital guide preview that pairs a cover with a lesson page. Soft beige styling brings together the author, content highlights, a prominent quotation, and step lists for creator-brand promotional materials.

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

  • Designing a preview for a free promotional guide
  • Presenting a lesson as a two-page spread
  • Creating a guide preview for a creator brand
nexu-io/html-anything9.2천2026년 10월 13일 업데이트

Design white, magazine-style slides for Xiaohongshu image posts and landscape presentations. Rainbow bars, large gradient headlines, pastel cards, and black emphasis labels provide a consistent visual style for presenting key points and quotations.

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

  • Designing image posts for Xiaohongshu
  • Styling a landscape presentation
  • Organizing key points into pastel cards
nexu-io/html-anything9.2천2026년 10월 13일 업데이트

Create a 16:9 product launch presentation with a dark cover and bright content slides. Introduce the problem, show the product, present three to six features and pricing tiers, then close with a clear call to action.

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

  • Preparing slides for a new product announcement
  • Explaining the problem behind a product
  • Presenting product features and pricing tiers
nexu-io/html-anything9.2천2026년 10월 13일 업데이트

Design a ten-page investor pitch deck covering the problem, solution, market, product, business progress, and fundraising request. Use a white background, a blue-to-purple gradient opening, and bar charts with prominent figures to present the business story.

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

  • Planning an investor fundraising presentation
  • Presenting market size and business progress
  • Organizing the business model and fundraising request
nexu-io/html-anything9.2천2026년 10월 13일 업데이트

Build a magazine-style presentation with a paper-and-ink look. Ten reusable layouts cover narratives, data, quotes, and comparisons, while five fixed palettes provide consistent styling in a single HTML file with keyboard navigation.

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

  • Sharing a viewpoint through a magazine-style presentation
  • Highlighting figures and quotes
  • Explaining steps or before-and-after comparisons
nexu-io/html-anything9.2천2026년 10월 13일 업데이트

Design a consumer-facing dashboard for dating or community activity. It brings together a live signal ticker, key performance indicators, a 30-day mutual-match bar chart, and match-rate trends in a restrained visual layout.

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

  • Designing a dashboard for a matching service
  • Presenting key community activity indicators
  • Showing mutual matches over the past 30 days
nexu-io/html-anything9.2천2026년 10월 13일 업데이트

Turn supplied CSV, Excel, or JSON data into a visual report page with key metric cards, multiple charts, and a data table. Include the reporting period, data sources, written observations, and a collapsible explanation of the methods used.

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

  • Turning weekly performance data into a report page
  • Reviewing key metrics and year-over-year changes
  • Sharing data trends with charts and supporting tables
nexu-io/html-anything9.2천2026년 10월 13일 업데이트

Create a film-style opening frame or chapter card as a single HTML file. Combine warm light leaks, grain texture, large serif titles, and optional scratches or film perforations for documentaries and personal short films.

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

  • Design an opening frame for a documentary
  • Create a title frame for a personal short film
  • Build chapter cards for a video
nexu-io/html-anything9.2천2026년 10월 13일 업데이트

Build a 16:9 slide deck for lifestyle, personal growth, or emotion-focused content. Cream backgrounds, soft glowing shapes, pastel cards, italic Playfair headings and numbers, and an SVG donut chart define the presentation’s visual style.

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

  • Creating slides about daily life and lifestyle
  • Presenting personal growth reflections
  • Organizing emotion-focused content into pastel slides
nexu-io/html-anything9.2천2026년 10월 13일 업데이트

Create a simple HTML slide deck for pitches, overviews, or study materials. Each page pairs one main point with an image or chart, with horizontal navigation, keyboard controls, and a progress bar.

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

  • Preparing slides for a project pitch
  • Presenting a product or service overview
  • Organizing study notes into slides
nexu-io/html-anything9.2천2026년 10월 13일 업데이트

Create slides for internal engineering talks or conference presentations using a dark color scheme and a monospaced font. Organize the deck around an agenda, code examples, key points, terminal screenshots, and a closing Q&A.

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

  • Prepare slides for an internal engineering talk
  • Structure a conference presentation
  • Combine code examples and terminal demos
nexu-io/html-anything9.2천2026년 10월 13일 업데이트

Create terminal-style review slides for command-line tools, AI agents, and developer tools. Present execution traces, code differences, and performance comparisons using dark backgrounds, mint-green text, outlined bar charts, and amber, green, or red tags.

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

  • Create review slides for command-line and developer tools
  • Present AI agent execution traces and code differences
  • Show performance comparisons in a terminal-style deck
nexu-io/html-anything9.2천2026년 10월 13일 업데이트

Create slides for safety reviews, risk discussions, incident retrospectives, or security exercises. Warning stripes, three-level cards, status alerts, policy code blocks, checklists, and stacked bar charts provide a visual structure for the presentation.

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

  • Preparing an incident retrospective presentation
  • Presenting risks in three levels
  • Sharing findings from simulated security attacks
nexu-io/html-anything9.2천2026년 10월 13일 업데이트

Create slides on a fixed 1920×1080 canvas, choosing each layout to suit the content. Consistent typography, one palette, and a single focal point per slide shape the presentation, with keyboard navigation and page numbers included.

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

  • Building a portfolio presentation
  • Designing a talk with varied slide layouts
  • Preparing slides for an art or design class
nexu-io/html-anything9.2천2026년 10월 13일 업데이트

Design a dark slide deck for AI products, knowledge graphs, or developer tool launches. Combine a graph-based cover, glowing blurred shapes, gradient section titles, highlighted code or command-line examples, and frosted-glass-style cards.

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

  • Prepare slides introducing an AI product
  • Present a knowledge graph project
  • Create a developer tool launch deck
nexu-io/html-anything9.2천2026년 10월 13일 업데이트

Create a minimal presentation built around large headlines, solid backgrounds, and arrow-prefixed lists. The template adapts the page count to the content and includes keyboard navigation hints and page numbers.

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

  • Presenting an idea with few visuals
  • Building a talk around bold headlines
  • Organizing key points into arrow-prefixed lists
nexu-io/html-anything9.2천2026년 10월 13일 업데이트

Create a landscape card for an X post, featuring a short quote, insight, or data point. The layout combines prominent text with attribution, a handle, a category label, and a brand watermark.

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

  • Sharing a quote with author attribution on X
  • Highlighting a data point in a social post
  • Creating branded cards for short insights
nexu-io/html-anything9.2천2026년 10월 13일 업데이트

Create documents with a warm parchment background, ink-blue accents, and serif typography. Layouts cover one-page summaries, reports, letters, resumes, and more, using type size and spacing to give each page a composed, print-like appearance.

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

  • Designing a one-page summary
  • Formatting a long report
  • Preparing a letter or resume
nexu-io/html-anything9.2천2026년 10월 13일 업데이트

Turn supplied data into a newspaper-style chart with a takeaway headline, annotations, and source notes. Create line, bar, or range-band charts, which show an interval around a central line, with staggered animation in a single HTML file.

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

  • Create a chart segment for a video
  • Prepare a data chart card for Twitter
  • Visualize CSV or JSON data with a takeaway headline
nexu-io/html-anything9.2천2026년 10월 13일 업데이트

Create a macOS-style notification banner from an announcement or message, complete with an app icon, title, and body text. The single-file HTML design supports frosted-glass styling, light or dark appearances, and placement over video.

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

  • Creating a notification overlay for a video corner
  • Designing a product announcement banner
  • Presenting an announcement as a notification-style social image
nexu-io/html-anything9.2천2026년 10월 13일 업데이트

Design three screens for a habit app inspired by role-playing games: a cover, daily quests with experience points, and quest details with subtasks and rewards. Present them in phone frames against a dark background.

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

  • Exploring a quest-based habit app design
  • Designing daily tasks with experience points and levels
  • Presenting three app screens together
nexu-io/html-anything9.2천2026년 10월 13일 업데이트

Create a branded video ending in a single HTML file. Geometric pieces assemble into a logo, followed by a glow, brand name, tagline, and call to action. The animation plays once and holds the completed end card.

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

  • Creating a branded video end card
  • Animating a logo assembled from geometric pieces
  • Closing a video with a tagline and call to action
nexu-io/html-anything9.2천2026년 10월 13일 업데이트

Build a single-page quarterly finance report combining four key metrics, revenue and cash burn charts, and a profit and loss summary. Add five highlights, an outlook, and an expandable methodology section to explain the figures.

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

  • Preparing a quarterly financial overview
  • Presenting revenue and cash burn together
  • Explaining results alongside the outlook
nexu-io/html-anything9.2천2026년 10월 13일 업데이트

본인 계정인가요? GitHub를 연동하면 크리에이터 페이지에 모을 수 있습니다 (일본어)