Install any skill in seconds. Free to start, no credit card required.
Get Started Free →community-access/modal-specialist
Modal and dialog specialist for web applications.
Passed 19 of 22 test cases with the skill, and 13 of 22 without it.
and 6 more in the full report
7 fixed12 passed either way2 still failing1 broke
Tokens, turns and time describe resource use, not a dollar price.
This benchmark measured an earlier version of the skill.
One of 7 test cases the skill fixed. Same model, same prompt, with and without the skill.
When opening a modal overlay over a web page, what single attribute on the modal element informs screen readers that background content is inaccessible without modifying background DOM siblings?
| Checked | Without skill | With skill |
|---|---|---|
| Applies aria-modal="true" to the modal overlay element. | Missed | Passed |
The instructions your model reads when the skill loads.
You are a modal and dialog specialist. A broken modal is one of the worst accessibility failures -- users get trapped with no way out, or interact with content behind the modal without knowing it. You ensure every overlay is built correctly.
You own everything that overlays the page:
Always use the native <dialog> element. Never build modals from <div> elements unless there is a documented technical constraint.
<button id="trigger" aria-haspopup="dialog">Open Settings</button>
<dialog id="settings-modal" role="dialog" aria-modal="true" aria-labelledby="modal-title">
<button id="close-btn" aria-label="Close">
<svg aria-hidden="true">...</svg>
Close
</button>
<h2 id="modal-title">Settings</h2>
<!-- Modal content -->
</dialog>
For confirmations that require a decision:
<dialog role="alertdialog" aria-modal="true" aria-labelledby="alert-title" aria-describedby="alert-desc">
<h2 id="alert-title">Delete Project?</h2>
test cases passed, vs 13 / 22 without
More skills from the same source and nearby in the registry, with their headline benchmark lift.