The pencil icon: a 24 by 24 stroke glyph that takes its colour from the text around it.
registry/behivetech/icons/pencil at v0.1.0, snapshotted 2026-11-10
pencil.tsx
1import { createIcon } from "@behivetech/icons.base";23/** The pencil icon: a stroke glyph on a 24 by 24 grid that inherits the text colour. */4export const PencilIcon = /*#__PURE__*/ createIcon(5 "PencilIcon",6 <>7 <path d="M12 20h9" />8 <path d="M16.5 3.5a2.121 2.121 0 0 1 3 3L7 19l-4 1 1-4Z" />9 </>,10);1112export default PencilIcon;
index.ts
1export { PencilIcon, default } from "./pencil.js";
pencil.example.tsx
1import { PencilIcon } from "./pencil.js";23/** The icon at each size; it takes its colour from the surrounding text. */4export const PencilIconSizes = () => (5 <>6 <PencilIcon size="sm" />7 <PencilIcon />8 <PencilIcon size="lg" />9 <PencilIcon size="xl" />10 </>11);1213/** Named with `titleAccess`, so assistive technology announces it. */14export const NamedPencilIcon = () => <PencilIcon titleAccess="Pencil" />;