Skip to content
Skillpedia
Writing101k · #448

html-ppt-zhangzara-daisy-days

Lets your agent create training materials for new app users. Teaches the path to first value and retention habits.

What it does

This template creates HTML presentations with a cheerful and welcoming design, using pastel colors and illustrations like daisies, stars, and rainbows. It's ideal for educational content, workshops, or any project needing a friendly and visually appealing touch.

When to use it

  • ✓Creating material for a wellness workshop.
  • ✓Developing a presentation for a creative project or portfolio.
  • ✓Making an invitation or event announcement with a light and fun tone.

Example of what to ask your AI

“Create a presentation about gardening for kids using the Daisy Days theme.”

Want more? Open the sections below.

How to use

The easiest way: copy the message below and paste it into Claude, ChatGPT, Cursor or any AI. It reads the skill and follows the instructions.

Skill link

https://github.com/nexu-io/open-design/blob/main/design-templates/html-ppt-zhangzara-daisy-days/SKILL.md

Ready-to-paste message

Use this skill to help me: https://github.com/nexu-io/open-design/blob/main/design-templates/html-ppt-zhangzara-daisy-days/SKILL.md Read the SKILL.md file at that link and follow its instructions for my task.
How it works

You start with a ready-made HTML file and only need to replace the text and images with your own content. It's important to maintain the original visual style, like fonts and colors, so the presentation keeps the template's identity.

Installation

Easiest way: copy the skill link and paste it into Claude, ChatGPT or Cursor asking it to follow the instructions.

In the terminal (Claude Code, Codex, Cursor), in your project folder:

npx skills add nexu-io/open-design --skill html-ppt-zhangzara-daisy-days

Or download just the file:

curl -L https://raw.githubusercontent.com/nexu-io/open-design/main/design-templates/html-ppt-zhangzara-daisy-days/SKILL.md -o SKILL.md
Technical content (original SKILL.md)

Original text by the author, straight from GitHub.

Daisy Days

Cheerful pastel deck with hand-drawn daisies, stars, and rainbows. Friendly, soft, and warm.

A single self-contained HTML deck — typography, palette, decorative system, and slide vocabulary are all tuned together. Mixing layouts across templates breaks the system; stay inside this one.

At a glance

  • Scheme: light
  • Formality: low
  • Density: medium
  • Slides in demo: 10

Best for

Anything that should feel friendly, soft, and joyful: educational content, kids and family, wellness programs, community workshops, creator portfolios for craft / illustration. Also lovely for an unexpected playful internal kickoff, a wedding planning deck, or any moment where warmth is the message — including across tech or business contexts.

Avoid for

Contexts where the audience explicitly expects authority and precision — the hand-drawn pastel SVG decorations are the opposite of buttoned-up.

Workflow

  1. Clone example.html into the user's workspace as the working file.
  2. Replace placeholder content with the user's real headlines, body copy, numbers, names, dates, and section labels. Match existing dimensions when swapping image placeholders.
  3. Preserve the design system. Never substitute fonts, recolor the palette, restructure the layout grid, or strip decorative elements (corner brackets, paper grain, geometric shapes, illustrated SVGs). They are part of the identity.
  4. Adjust deck length by duplicating layouts. If the user has more content than the demo holds, duplicate an existing slide of the most appropriate layout. If less, drop slides from the bottom. Update page-number labels.
  5. Designing missing layouts: if a slide needs a layout the template doesn't have, design it from scratch using the same fonts, palette, decorative vocabulary, spacing rhythm, and component grammar — never bail to a different template.
  6. Keep the navigation runtime as shipped. If the deck ships an assets/deck-stage.js or inline keyboard handler, leave it intact.

Output contract

Emit between <artifact> tags:

<artifact identifier="zhangzara-daisy-days" type="text/html" title="Deck Title">
<!doctype html>
<html>...</html>
</artifact>

Source & license

Vendored from upstream MIT-licensed zarazhangrui/beautiful-html-templates.

The full upstream MIT license text — including the original copyright notice — ships in this skill at LICENSE and must be redistributed alongside any copy of example.html, template.json, or any vendored assets/ runtime. See template.json for the upstream metadata snapshot.

FAQ

Can I change the colors and fonts?

It's not recommended. The design was intended to work as a whole, and changing these elements might break the template's look and identity.

What if I need more slides?

You can duplicate existing slides that have a similar layout to what you need. If you require a completely new layout, you should create it using the same visual elements from the template.

Where do I find the code to use?

The template is an HTML file that you can copy and adapt, following the usage instructions.

Details

Original description by the author

A customer-success workshop onboarding users to a project-management app — the first-value path and the habits that retain. Built as a decision-grade professional training deck for new customers, CS team.

repo: nexu-io/open-design

Popularity

GitHub stars
101k
Ranking position
#448
License
Apache-2.0
Updated
10/16/2026

Is this skill useful?

0

Sign in to vote.

Comments

  • …

More skills from this repository

Similar skills