cardFaceFromArtfunction
A card's face from artwork of your own: art is SVG markup (or a whole <svg> document) drawn on the card's paper in
a box 100 by 140, or in box, fitted to the card's height and centred; a whole <svg> is used as it is. It is how a
page draws a card no deck has, for one card, with no design registered. frame: "none" leaves the paper out for art that
fills the card. Scripts, handlers and foreign objects are taken out of the markup.
Import it
import { cardFaceFromArt } from "@johnmorrisdotca/toranpu/card-faces";Definition
function cardFaceFromArt(art: string, options?: Omit<CardFaceOptions, "design"> & { box?: readonly [number, number]; frame?: "paper" | "none"; }): stringParameters
| Name | Type | Description |
|---|---|---|
art | string | SVG markup for the face artwork. |
options (optional) | Omit<CardFaceOptions, "design"> & { box?: readonly [number, number]; frame?: "paper" | "none"; } | Options for this call; omitted fields retain their documented defaults. |
Returns
string
A card's face from artwork of your own: art is SVG markup (or a whole <svg> document) drawn on the card's paper in a box 100 by 140, or in box, fitted to the card's height and centred; a whole <svg> is used as it is. It is how a page draws a card no deck has, for one card, with no design registered. frame: "none" leaves the paper out for art that fills the card. Scripts, handlers and foreign objects are taken out of the markup.
Examples
import { cardFaceFromArt } from "@johnmorrisdotca/toranpu/card-faces";
console.log(cardFaceFromArt(`<circle cx="50" cy="70" r="20" fill="#2f5d4a"/>`).slice(0, 160));<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 140" aria-hidden="true" style="user-select:none;-webkit-user-select:none"><rect x=".5" y=".5" width="99What it prints (run when this page was built)