메뉴
Self-contained HTML blocks in inteligir notes — when interaction earns one, the runtime limits, and the sandbox contract.
기본적으로 소스를 먼저 확인하는 Prompt가 선택됩니다. 직접 명령으로 전환하거나 로컬 사본을 다운로드할 수도 있습니다.
설치 여부를 결정하기 전에 SKILL.md와 SkillsMP에 표시된 보조 파일을 읽어 보세요.
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
직접 명령은 검토 Prompt를 거치지 않습니다. 실행하기 전에 소스를 확인하세요.
npx skills add https://github.com/kyh/inteligir --skill inteligir-html명령은 한 줄로 유지됩니다. 복사하기 전에 가로로 스크롤해 전체 내용을 확인하세요.
로컬 사본을 원하시나요? SkillsMP에서 현재 제공할 수 있는 파일을 다운로드하세요.
SKILL.md 표시 중
| name | inteligir-html |
| description | Self-contained HTML blocks in inteligir notes — when interaction earns one, the runtime limits, and the sandbox contract. |
An inteligir-html fence holds a complete, self-contained document rendered in
a sandboxed frame. Use it for behavior someone must click — a prototype, a state
machine, a control worth trying before the team commits to it.
Do not rebuild what the editor already has. Tables, tabs, callouts, checklists, charts, and comments are real blocks: they are searchable, they round-trip, and they work in every other markdown tool. An HTML copy of one is a dead end.
```inteligir-html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
* { box-sizing: border-box; }
:root { color-scheme: light; }
body {
width: 900px;
min-height: 560px;
margin: 0;
padding: 28px;
background: #fbfbfa;
color: #1f1f1f;
font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
}
</style>
</head>
<body>
<main><!-- the artifact --></main>
</body>
</html>
```
Size belongs in the document's CSS, not on the fence line.
The frame is isolated, and that is the point — a note should never be able to reach the app or the vault. What that costs you:
DOMContentLoaded.localStorage, cookies, same-origin fetches, and any parent-window API are
unavailable. Do not design around state that outlives a reload.assets/x.png do not resolve inside the frame. A
small required image must be an inline data: URI. Never use file:// or an
absolute local path.Every visible control must actually work and use native semantics — a button is
a <button>. A control that looks live and does nothing is worse than no
control.
The block cannot see the app's theme. Choose one self-contained palette that
reads in both light and dark surroundings: an opaque neutral background, dark
ink, restrained accents, quiet borders. Set color-scheme so native controls
match. Do not add a theme toggle or a prefers-color-scheme query — the frame
does not know what it is sitting on.
Keep the surface flush; do not draw a heavy outer frame around your own content.
Preserve existing behavior when you edit — the whole document is one payload, so a careless rewrite loses working code with no diff worth reading.
If the document contains literal triple backticks, open the fence with four or more. Give separate jobs separate fences instead of one document that does everything.
