https://framer.com/m/ShareAI-osj82I.js

Io / Enhancements / CopyPageForAI

CopyPageForAI

CopyPageForAI turns the page the reader is on into clean text and hands it over — to the clipboard, or straight into an AI tool through a menu of destinations.

Enhancements15 controlspage to textAI hand-off

Examples

Live specimens for every control the component exposes.

Default

The main button copies the page. The menu beside it carries the AI destinations, in the order menuOrder gives.

Label

mainButtonText is the resting label. Everything else about the trigger — fill, radius, border — lives in the buttonStyle group.

default label

custom label

short label

Props

The controls exposed on the instance panel.

PropTypeBehaviour
buttonModeenumSplit button, or dropdown only.
mainButtonActionenumWhat the main half does — copy the page, or open it in one named AI service.
mainButtonTextstringLabel on the main button.
customIconsobjectIcons used in the menu.
menuOrderarrayWhich destinations appear, and in what order.
copySettingsobjectWhat gets included when the page is turned into text.
aiSettingsobjectThe AI destinations and how the text is handed to them.
openInNewTabbooleanOpens AI services and external links in a new tab.
githubUrlstringRepository URL behind the GitHub menu item.
canvasPreviewbooleanHolds the dropdown open on the canvas so it can be styled.
iconStyleobjectSize and colour of those icons.
buttonStyleobjectFill, radius and border of the trigger.
dropdownStyleobjectLook of the menu panel.
itemStyleobjectLook of each menu row.
dividerStyleobjectColour, width and inset of the divider between menu groups.
fontStyleobjectType used by the button and the menu.
transitiontransitionHow the menu opens and closes.
PropTypeBehaviour
buttonModeenumSplit button, or dropdown only.
mainButtonActionenumWhat the main half does — copy the page, or open it in one named AI service.
mainButtonTextstringLabel on the main button.
customIconsobjectIcons used in the menu.
menuOrderarrayWhich destinations appear, and in what order.
copySettingsobjectWhat gets included when the page is turned into text.
aiSettingsobjectThe AI destinations and how the text is handed to them.
openInNewTabbooleanOpens AI services and external links in a new tab.
githubUrlstringRepository URL behind the GitHub menu item.
canvasPreviewbooleanHolds the dropdown open on the canvas so it can be styled.
iconStyleobjectSize and colour of those icons.
buttonStyleobjectFill, radius and border of the trigger.
dropdownStyleobjectLook of the menu panel.
itemStyleobjectLook of each menu row.
dividerStyleobjectColour, width and inset of the divider between menu groups.
fontStyleobjectType used by the button and the menu.
transitiontransitionHow the menu opens and closes.

Usage

Guidance carried over from the component definition.

Reach for CopyPageForAI

Readers should be able to take a documentation page into an AI tool.

The page has long reference content worth quoting elsewhere.

The hand-off should offer several destinations from one control.

The page is reference material readers will want to quote elsewhere.

Reach for something else

The page content is private or paywalled.

You only need a plain copy button — use Copy Clipboard.

The text needs cleaning rules this component does not expose.

Io — Enhancements

Every specimen above is a live component instance. Colour, type and radius resolve from the project theme tokens.

io

An experiment in what a design system becomes when AI can consume it.

© 2026 io

Contact me

Create a free website with Framer, the website builder loved by startups, designers and agencies.