Prompt Library.
← Back to the library

Resource details · Practical tools

AI Design Skills: make one simple landing page

Give your AI tool a clear one-page brief, then check structure and phone layout before adding polish.

Titles, introductions and guides are translated. Copyable resources, examples and licences retain their original language. Code is displayed only; this page does not execute it or call AI.

Resource details

For people making a first page with their own AI tool. These are design instructions, not automatic hosting; begin with clearly fictional practice content.

Before you start

Platforms
Windows · macOS · Linux
Content updated
  • Have your own supported AI chat or coding tool and read the pinned official landing-page-design instructions first.
  • Tool accounts, model quotas and later hosting may cost extra. This guide does not require a full development environment before reading.

This original guide is shared under CC BY 4.0 and links to official sources. No upstream skill text, source archive, installer, photo, icon or model is bundled. Check third-party assets, dependencies, trademarks and cloud-service terms and fees separately.

Common pitfalls

  • Do not present fictional prices, reviews, people or performance as real customer proof; check image and font rights.
  • Retain Elaya’s full MIT notice. The skill’s adapted Leonxlnx/taste-skill notice is included below; a README attribution claim does not replace the formal license conditions.
Official setup guide ↗

Complete resource

【Practice goal】Make one fictional flower-shop page with opening hours, three services and a contact section. 【Setup and costs】Have your own supported AI chat or coding tool and read the pinned official landing-page-design instructions first. Tool accounts, model quotas and later hosting may cost extra. This guide does not require a full development environment before reading. 【Three steps】 1. Read the official instructions: Open the pinned README and landing-page-design to see what project information it asks for. Choose the route appropriate to your own tool. 2. Write a small brief: Ask for a fictional flower-shop page. Request missing details first, no invented real reviews, and no connected payments or form service. 3. Check a phone-width view: Check the heading, three services and contact explanation. Fix text overflow, contrast and button meaning before considering publication. 【Check your result】The goal is a clear practice page readable on a phone. You must inspect the generated result; this site has not model-tested it. 【Source and license】Official repository elayadesign/ai-design-skills; reviewed commit ded7efc9d5c02761c41a03caf3b78f9259ab8828. Observed on GitHub’s rolling Today list during the 2026-10-29 review, not a whole-day ranking or security endorsement. The main project uses MIT: commercial use, modification and redistribution are allowed when the full copyright and permission notice is retained, without separately contacting the author. This does not license every dependency, asset or model service. Do not present fictional prices, reviews, people or performance as real customer proof; check image and font rights. Retain Elaya’s full MIT notice. The skill’s adapted Leonxlnx/taste-skill notice is included below; a README attribution claim does not replace the formal license conditions. This original guide is shared under CC BY 4.0 and links to official sources. No upstream skill text, source archive, installer, photo, icon or model is bundled. Check third-party assets, dependencies, trademarks and cloud-service terms and fees separately. Official documentation and complete licenses at a fixed commit were reviewed read-only on 2026-10-29. The upstream project was not installed or run, model-tested or security-audited. The results below are goals for you to check.

Original guide (Chinese)
【练习目标】先做一个虚构花店的单页:营业时间、三项服务和一个联系区域。

【准备与成本】准备自己可用的 AI 对话或编程工具,并先阅读官方固定版本的 landing-page-design 说明。
工具账号、模型额度和后续网页托管费用另计;本站不要求先安装整套开发环境。

【三步尝试】
1. 看官方说明: 打开固定版本 README,进入 landing-page-design,了解它会要求哪些项目资料;只选择与你的工具相符的使用方式。
2. 写一个小需求: 告诉 AI:做一张虚构花店介绍页,先问我缺的信息,不要编造真实评价,不连接支付或表单服务。
3. 在手机宽度下检查: 检查标题、三项服务和联系说明是否清楚;先改文字溢出、对比度和按钮含义,不急着发布。

【自己核对】目标是一张信息清楚、手机上能读懂的练习页面;生成效果需由你实际检查,本站未调用模型验证。

【来源与许可】官方仓库 elayadesign/ai-design-skills;本次固定提交 ded7efc9d5c02761c41a03caf3b78f9259ab8828。2026-10-29 审核时在 GitHub Today 滚动榜观察到本项目;这不是全天排名或安全背书。
主项目采用 MIT,可在保留完整版权和许可声明的条件下商用、修改和再分发,无需另行联系作者;这不等于对全部依赖、素材或模型服务的授权。

不要把虚构价格、评价、人物或业绩展示成真实客户证言;图片和字体要核对授权。
保留 Elaya 的 MIT 全文;技能中的 Leonxlnx/taste-skill 改编声明另列在下方。README 的免署名说法不能替代正式许可条件。

本站提供原创导览和官方入口,导览按 CC BY 4.0 分享;不捆绑上游技能正文、源码、安装包、照片、图标或模型。第三方素材、依赖、商标与云服务须另核许可和费用。

2026-10-29 已只读核对官方固定提交的资料和完整许可;未安装或运行上游项目,未做模型实测或安全审计。以下结果是供你自行核对的目标。

How to use it

Make one fictional flower-shop page with opening hours, three services and a contact section.

  1. Read the official instructions

    Open the pinned README and landing-page-design to see what project information it asks for. Choose the route appropriate to your own tool.

  2. Write a small brief

    Ask for a fictional flower-shop page. Request missing details first, no invented real reviews, and no connected payments or form service.

  3. Check a phone-width view

    Check the heading, three services and contact explanation. Fix text overflow, contrast and button meaning before considering publication.

Expected output

The goal is a clear practice page readable on a phone. You must inspect the generated result; this site has not model-tested it.

Official documentation and complete licenses at a fixed commit were reviewed read-only on 2026-10-29. The upstream project was not installed or run, model-tested or security-audited. The results below are goals for you to check.

Suitable uses

  • For people making a first page with their own AI tool. These are design instructions, not automatic hosting; begin with clearly fictional practice content.

Before using it

  • The main project uses MIT: commercial use, modification and redistribution are allowed when the full copyright and permission notice is retained, without separately contacting the author. This does not license every dependency, asset or model service.
  • Do not present fictional prices, reviews, people or performance as real customer proof; check image and font rights.
  • Retain Elaya’s full MIT notice. The skill’s adapted Leonxlnx/taste-skill notice is included below; a README attribution claim does not replace the formal license conditions.
  • This original guide is shared under CC BY 4.0 and links to official sources. No upstream skill text, source archive, installer, photo, icon or model is bundled. Check third-party assets, dependencies, trademarks and cloud-service terms and fees separately.

Authors and sources

Attribution
Site guide
Upstream author
Elaya
Source revision
ded7efc9d5c02761c41a03caf3b78f9259ab8828
Licence checked
2026-10-29

Notices and modifications

Official repository elayadesign/ai-design-skills; reviewed commit ded7efc9d5c02761c41a03caf3b78f9259ab8828. Observed on GitHub’s rolling Today list during the 2026-10-29 review, not a whole-day ranking or security endorsement.

Complete licence

CC BY 4.0

CC BY 4.0 · Read the complete licence ↗

Upstream licence · MIT

MIT License

Copyright (c) 2026 Elaya

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.

Read the complete licence ↗

NOTICE

Upstream adapted material: Leonxlnx/taste-skill. Credit appears in https://github.com/elayadesign/ai-design-skills/blob/ded7efc9d5c02761c41a03caf3b78f9259ab8828/skills/landing-page-design/SKILL.md#credits

MIT License

Copyright (c) 2026 Leonxlnx

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
```
</details>

Verification scope

Documentation and license reviewed

Official documentation and complete licenses at a fixed commit were reviewed read-only on 2026-10-29. The upstream project was not installed or run, model-tested or security-audited. The results below are goals for you to check.

2026-10-29