How do I install the Cgpt Canvas Flipcards skill?

Run npx skillmds@latest add pvsundar/cgpt-canvas-flipcards in your terminal (requires Node.js), paste this page's agent-chat prompt into Claude, Cursor, or any MCP-connected agent, or download the SKILL.md file and copy it into your agent's skills directory.

Is Cgpt Canvas Flipcards safe to use?

This skill has not completed SkillMD's automated safety review yet. SkillMD never runs a skill's scripts for you; review the SKILL.md before installing.

Which AI agents work with Cgpt Canvas Flipcards?

This skill is tagged as working with Claude Code, Claude.ai, OpenAI Codex. SKILL.md is an open format, so most agents that read a skills directory can load it too.

Is Cgpt Canvas Flipcards free to use?

Yes. Installing skills from SkillMD is free, and the skill stays under its author's original license.

Who published Cgpt Canvas Flipcards?

pvsundar (@pvsundar) published this skill. Their other Agent Skills are listed on their SkillMD profile.

Cgpt Canvas Flipcards by pvsundar — Agent Skill

Name: Cgpt Canvas Flipcards
Author: pvsundar

Cgpt Canvas Flipcards

Create self-contained HTML study flipcards and Canvas LMS embed instructions for teaching modules. Use when the user asks for flip cards, study cards, interactive HTML review tools, Canvas iframe embeds, or troubleshooting Canvas pages that strip JavaScript.

pvsundar Updated Sep 21, 2026

File contents

CGPT Canvas Flipcards

Use this skill to build standalone HTML flipcard study tools and package them for Canvas. The output should work as a local HTML file and as a Canvas file-download iframe.

Canvas Constraint

Canvas may strip <script> tags from Rich Content Editor pages and file previews. Do not tell the user to paste the full interactive HTML into a Canvas page body. Instead:

upload the .html file to Canvas Files
use the /download URL in an iframe
provide a direct full-screen download link as fallback

Workflow

Gather topic, course, audience, number of cards, source material, and whether Canvas embed code is needed.
Create a self-contained HTML file with no CDN dependencies.
Use 8-15 cards for a normal session unless the user requests otherwise.
Each card should have:
- category
- term
- hint
- definition
- example
Include category filters, shuffle, reset, progress, and print-friendly CSS when feasible.
Verify the HTML file exists, contains normal document structure, and has no external dependencies unless explicitly allowed.

Card Quality

Keep hints short and non-revealing.
Definitions should be precise and student-facing.
Examples should be concrete and domain-relevant.
Avoid long prose cards; split dense concepts.
Use accessible colors, keyboard-focus styles, and responsive layout.

Canvas Embed Pattern

After the user uploads the file and provides the Canvas file ID:

<iframe src="/courses/{COURSE_ID}/files/{FILE_ID}/download"
        width="100%"
        height="850"
        style="border:1px solid #ccc; border-radius:8px;"
        allowfullscreen>
</iframe>

<p><a href="/courses/{COURSE_ID}/files/{FILE_ID}/download" target="_blank">
Open full-screen in a new tab
</a></p>

Do not hardcode a course ID unless the user provides or confirms it.

File Naming

Use lowercase names:

study-flipcards-{topic-slug}.html

For BUS490, use:

bus490-{topic-slug}.html

Verification

Before delivery:

confirm the HTML file exists and is non-empty
inspect for <html>, <style>, and <script>
check that all cards have term, hint, definition, and example
open with Browser when visual/interactivity verification is requested or practical
provide exact local path and Canvas embed snippet

Bundled Example

This repository includes a tested showcase example at:

cgpt-canvas-flipcards/examples/study-flipcards-github-repos-for-scholars.html

Use the paired Markdown and HTML notes in the same folder when demonstrating what the skill produces and how the artifact can be shared.

---name: cgpt-canvas-flipcardsdescription: Create self-contained HTML study flipcards and Canvas LMS embed instructions for teaching modules. Use when the user asks for flip cards, study cards, interactive HTML review tools, Canvas iframe embeds, or troubleshooting Canvas pages that strip JavaScript.---# CGPT Canvas FlipcardsUse this skill to build standalone HTML flipcard study tools and package them for Canvas. The output should work as a local HTML file and as a Canvas file-download iframe.## Canvas ConstraintCanvas may strip `<script>` tags from Rich Content Editor pages and file previews. Do not tell the user to paste the full interactive HTML into a Canvas page body. Instead:- upload the `.html` file to Canvas Files- use the `/download` URL in an iframe- provide a direct full-screen download link as fallback## Workflow1. Gather topic, course, audience, number of cards, source material, and whether Canvas embed code is needed.2. Create a self-contained HTML file with no CDN dependencies.3. Use 8-15 cards for a normal session unless the user requests otherwise.4. Each card should have: - category - term - hint - definition - example5. Include category filters, shuffle, reset, progress, and print-friendly CSS when feasible.6. Verify the HTML file exists, contains normal document structure, and has no external dependencies unless explicitly allowed.## Card Quality- Keep hints short and non-revealing.- Definitions should be precise and student-facing.- Examples should be concrete and domain-relevant.- Avoid long prose cards; split dense concepts.- Use accessible colors, keyboard-focus styles, and responsive layout.## Canvas Embed PatternAfter the user uploads the file and provides the Canvas file ID:```html<iframe src="/courses/{COURSE_ID}/files/{FILE_ID}/download" width="100%" height="850" style="border:1px solid #ccc; border-radius:8px;" allowfullscreen></iframe><p><a href="/courses/{COURSE_ID}/files/{FILE_ID}/download" target="_blank">Open full-screen in a new tab</a></p>```Do not hardcode a course ID unless the user provides or confirms it.## File NamingUse lowercase names:```textstudy-flipcards-{topic-slug}.html```For BUS490, use:```textbus490-{topic-slug}.html```## VerificationBefore delivery:- confirm the HTML file exists and is non-empty- inspect for `<html>`, `<style>`, and `<script>`- check that all cards have term, hint, definition, and example- open with Browser when visual/interactivity verification is requested or practical- provide exact local path and Canvas embed snippet## Bundled ExampleThis repository includes a tested showcase example at:```textcgpt-canvas-flipcards/examples/study-flipcards-github-repos-for-scholars.html```Use the paired Markdown and HTML notes in the same folder when demonstratingwhat the skill produces and how the artifact can be shared.

Frequently asked questions