Github Source
Paste fails when copying images from localhost last updated just now partial support
Astro Image component
<Image> component
img element
<img> element
public img element
<img> public

To reproduce

  1. Clone the repo: https://github.com/YottaYocta/paper-localhost-snapshot
  2. Run the dev server and open the page in a browser.
  3. Copy one of the images in the component column.
  4. Paste into editor.
Max/min-width is kept when pasting snapshots to Paper last updated just now not supported

Card with max-width

This element has max-width and min-width set. Copy and paste it into editor.

When an element with a max-width (or min-width) constraint is copied and pasted into editor, the pasted node inherits the constraint. There is no way to overwrite it without creating a new element.

To reproduce

  1. Copy the card in the component column.
  2. Paste it into the editor.
  3. Try to increase the pasted node's width beyond its max-width.
Inline styled text last updated 2d ago not supported

Some plain text here followed by styled text here

Some plain text here followed by

styled text here but in a div
Snapshot splits non-span elements into their own style, but eliminates any styling within a <p> tag if done through a span
Diagonal buttons last updated 1h ago partial support
clip-path button
skew button
clip-path button preserved when copied to editor, but doesn't seem to be any option to edit. The other uses skew and loses its styling
Stuff with shadows last updated 1h ago partial support

SVG

feDropShadow
CSS drop-shadow()
colored shadow
Astro logo
img + drop-shadow()

SVG + Tailwind shadow class

shadow-md
shadow-lg

HTML

Aa

text-shadow

feDropShadow and colored shadow both work; drop-shadow filter not carried over to paper for both images without background and svg elements.

Image filters & blend modes last updated 12m ago full support
multiply + hue-rotate
screen + invert
grayscale + overlay
darken
lighten
color-dodge + saturate
color-burn + hue-rotate
hard-light + brightness
soft-light + contrast
difference + hue-rotate
exclusion + sepia
hue + hue-rotate
saturation + saturate
color (on grayscale)
luminosity + invert
Each example layers an absolutely positioned copy of the image over the original with a CSS mix-blend-mode and/or filter applied to the top layer.
Interactive element-shader last updated never not supported
A multipass webgl shader (GLSL ES3). Produces blank image when copied
Complex transforms last updated 2d ago partial support
Card A
Card B
Card C
tilt card
Rotation preserved in editor for rotation example. Skew not preserved