A watermark for an image. Able to select position, different emojis and also add your own. Some simple styling options including opacity are also able to be set.
Try the Telex project here.
Prompt
Create a WordPress block that adds watermarks to images. In the editor, display the base image with watermark preview overlay. Provide inspector controls with three panels: Image panel with MediaUpload for selecting base image, Watermark panel with toggle between uploaded custom watermark or 6 preset line icons displayed in a grid, and Position panel with AlignmentMatrixControl for 9-position placement plus RangeControl for 0-100% transparency. Include Styles tab with watermark size controls, padding options, and color overlay settings. Store baseImageUrl, baseImageId, watermarkType, watermarkImageUrl, watermarkImageId, selectedPreset, position, and opacity as attributes. On frontend, render semantic figure/img HTML with watermark positioned as overlay using CSS flexbox. Apply opacity via inline styles. Include alt text fields for both images. Ensure responsive design maintains aspect ratios. Use block.json schema with native WordPress components and include 6 simple black SVG icon presets.