LogoAwesome Skills
  • Search
  • Category
  • Tag
  • Blog
LogoAwesome Skills
LogoAwesome Skills

Discover Open-Source Agent Skills for AI Coding Assistants

Product

  • Search
  • Category
  • Tag
  • Blog

Resources

  • Claude Skill Docs
  • Antigravity Skills Docs

Tools

  • Claude Code
  • OpenCode
  • Cursor
  • Codex
  • Antigravity

Company

  • Privacy Policy
  • Terms of Service
  • Sitemap

©2026 Awesome Skills. All rights reserved.

Privacy PolicyTerms
Back to Skills

infocard

Create editorial-style information cards using HTML/CSS in Markdown. Best for knowledge summaries, data highlights, event announcements, and single-topic content cards with magazine-quality typography.

2,949stars173forksUpdated 6/12/2026
Documentation#html-css#documentation#editorial-cards#markdown#knowledge-summary#content-visualization

Security Assessment

Safe(100/100)
Security Score100/100

About infocard

The Infocard skill allows users to create editorial-style information cards directly in Markdown using embedded HTML and CSS. It addresses the challenge of presenting structured, visually appealing content within Markdown documents without relying on external tools or image assets. By providing a framework for content analysis and automated styling, it simplifies the process of turning knowledge summaries, event announcements, or single-topic content into magazine-quality cards that are ready for web or documentation use.

Infocard offers a set of critical rules and features to ensure high-quality output. It requires direct HTML embedding without empty lines to prevent parsing errors, enforces content analysis across density, structure, and mood dimensions, and uses automatic tone sensing to select appropriate color palettes based on keywords. The skill also provides guidance on typography hierarchy, layout selection, and editorial handling of titles and subtitles. Users can choose style templates that override tone sensing for more precise visual control.

This skill is particularly useful for content creators, technical writers, educators, and marketing professionals who need to summarize or highlight key information in an engaging, readable format. Use cases include knowledge summaries, data highlights, event announcements, educational cards, or single-topic feature cards. Its structured approach ensures clarity, visual consistency, and accessibility, making it suitable for both individual authors and teams producing content across multiple platforms.

FAQ

How do I create an infocard in Markdown?

You write the info card directly in HTML embedded in your Markdown file. Do not use code fences; keep the HTML block continuous without empty lines.

Which platforms or editors support Infocard?

Infocard is designed to work with multi-platform Markdown viewers including Chrome, Edge, Firefox, and VS Code with the Markdown Viewer extension installed.

Can I customize the color palette of an infocard?

Yes. By default, Infocard auto-selects a color palette based on content tone keywords, but you can override it by explicitly choosing a style template.

What types of content are suitable for Infocard?

Infocard is ideal for single-topic summaries, event announcements, data highlights, and knowledge cards where structured visual presentation improves readability.

Are there any limitations regarding HTML structure?

Yes. The HTML must be continuous without empty lines, and the skill expects standard HTML/CSS embedding within Markdown. Improper spacing may cause parsing errors.

All Files

66 files
layouts/badge-grid.md3.3 KB
View
layouts/architecture-map.md4.3 KB
View
layouts/checklist-board.md3.3 KB
View
layouts/financial-snapshot.md4.2 KB
View
layouts/funnel-stack.md3.7 KB
View
layouts/incident-review.md4.0 KB
View
layouts/org-update.md4.2 KB
View
layouts/board-memo.md4.1 KB
View
layouts/comparison.md3.3 KB
View
layouts/layered-sidebar-map.md6.9 KB
View
layouts/partner-brief.md3.6 KB
View
layouts/bento-grid.md3.1 KB
View
layouts/compliance-audit.md4.2 KB
View
layouts/healthcare-summary.md3.7 KB
View
layouts/customer-story.md3.9 KB
View
layouts/matrix-table.md5.3 KB
View
layouts/policy-memo.md3.5 KB
View
layouts/education-module.md3.3 KB
View
layouts/hero-card.md2.1 KB
View
layouts/metric-board.md3.9 KB
View
layouts/principle-grid.md6.1 KB
View
layouts/radial-hub.md3.6 KB
View
layouts/news-bulletin.md2.9 KB
View
layouts/pros-cons.md4.1 KB
View
layouts/quadrant-matrix.md3.8 KB
View
layouts/risk-register.md3.8 KB
View
layouts/staircase-progression.md6.2 KB
View
styles/academic-paper.md5.0 KB
View
styles/deep-night.md4.8 KB
View
styles/incident-desk.md4.6 KB
View
styles/neo-brutalism.md5.0 KB
View
styles/policy-paper.md4.7 KB
View
styles/swiss-grid.md5.2 KB
View
layouts/quote-card.md2.2 KB
View
layouts/roadmap-board.md4.1 KB
View
layouts/station-workflow.md7.3 KB
View
styles/bold-contrast.md4.7 KB
View
styles/editorial-warm.md5.1 KB
View
styles/japanese-minimal.md4.5 KB
View
styles/news-broadcast.md4.7 KB
View
layouts/research-abstract.md3.0 KB
View
layouts/stacked-modules.md3.2 KB
View
SKILL.md22.6 KB
View
styles/customer-spotlight.md5.0 KB
View
styles/glassmorphism.md5.5 KB
View
styles/navy-formal.md4.7 KB
View
styles/pitch-deck-vc.md4.9 KB
View
styles/sunset-warm.md5.0 KB
View
layouts/sales-brief.md3.8 KB
View
layouts/terminal-window.md4.1 KB
View
styles/clinical-brief.md4.6 KB
View
styles/education-studio.md4.6 KB
View
styles/lab-journal.md4.9 KB
View
styles/paper-minimal.md4.5 KB
View
styles/slate-chalk.md5.2 KB
View
styles/terminal-green.md5.0 KB
View
layouts/split-panel.md2.6 KB
View
layouts/timeline-flow.md3.4 KB
View
styles/corporate-clean.md5.0 KB
View
styles/engineering-whiteprint.md5.2 KB
View
styles/midcentury.md5.3 KB
View
styles/partner-channel.md4.7 KB
View
styles/soft-neutral.md4.9 KB
View
styles/trust-center.md4.8 KB
View
styles/sales-room.md4.4 KB
View
styles/tech-blueprint.md5.4 KB
View

Install infocard

Download and extract the skill files to your .claude/skills/ directory.

Quick Setup:

  1. Copy the skill folder to .claude/skills/
  2. Claude will automatically detect and use the skill

Repository

markdown-viewer/skills

Related Skills

research

448

secops-detection-engineering

21,346

qdrant-monitoring

259

project-architecture

3