{"id":14555,"date":"2025-12-28T20:08:41","date_gmt":"2025-12-28T19:08:41","guid":{"rendered":"https:\/\/monodes.com\/predaelli\/?p=14555"},"modified":"2025-12-28T20:10:22","modified_gmt":"2025-12-28T19:10:22","slug":"wired-elements","status":"publish","type":"post","link":"https:\/\/monodes.com\/predaelli\/2025\/12\/28\/wired-elements\/","title":{"rendered":"Wired Elements"},"content":{"rendered":"\n<h2 class=\"wp-block-heading\"><a href=\"https:\/\/wiredjs.com\/\">Wired Elements<\/a>, the perfect compation of rough.js <\/h2>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\">\n<p>A set of common UI elements with a hand-drawn, sketchy look. These can be used for wireframes, mockups, or just the fun hand-drawn look.<\/p>\n\n\n\n<p>The elements are drawn with enough randomness that no two renderings will be exactly the same \u2014 just like two separate hand-drawn shapes.<\/p>\n<\/blockquote>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p class=\"excerpt\">Wired Elements, the perfect compation of rough.js A set of common UI elements with a hand-drawn, sketchy look. These can be used for wireframes, mockups, or just the fun hand-drawn look. The elements are drawn with enough randomness that no two renderings will be exactly the same \u2014 just like two separate hand-drawn shapes.<\/p>\n<p class=\"more-link-p\"><a class=\"more-link\" href=\"https:\/\/monodes.com\/predaelli\/2025\/12\/28\/wired-elements\/\">Read more &rarr;<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"inline_featured_image":false,"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"activitypub_content_warning":"","activitypub_content_visibility":"","activitypub_max_image_attachments":4,"activitypub_interaction_policy_quote":"anyone","activitypub_status":"federated","footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":false,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2}},"categories":[50],"tags":[],"class_list":["post-14555","post","type-post","status-publish","format-standard","hentry","category-javascript"],"jetpack_publicize_connections":[],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/p6daft-3ML","jetpack-related-posts":[{"id":5871,"url":"https:\/\/monodes.com\/predaelli\/2019\/08\/05\/printable-rpg-is-creating-hand-drawn-rpg-maps-patreon\/","url_meta":{"origin":14555,"position":0},"title":"Printable RPG is creating hand-drawn RPG Maps | Patreon","author":"Paolo Redaelli","date":"2019-08-05","format":false,"excerpt":"Become a patron of Printable RPG today: Read 67 posts by Printable RPG and get access to exclusive content and experiences on the world\u2019s largest membership platform for artists and creators. Source: Printable RPG is creating hand-drawn RPG Maps | Patreon","rel":"","context":"In &quot;Role Play Games&quot;","block_context":{"text":"Role Play Games","link":"https:\/\/monodes.com\/predaelli\/category\/games\/role-play-games\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":6310,"url":"https:\/\/monodes.com\/predaelli\/2019\/12\/12\/hand-drawn-border-buttons-in-css-%e2%84%82%f0%9d%95%a0%f0%9d%95%95%f0%9d%95%96%f0%9d%95%84%f0%9d%95%aa%f0%9d%95%8c%f0%9d%95%80\/","url_meta":{"origin":14555,"position":1},"title":"Hand-Drawn Border Buttons in CSS \u2013 \u2102\ud835\udd60\ud835\udd55\ud835\udd56\ud835\udd44\ud835\udd6a\ud835\udd4c\ud835\udd40","author":"Paolo Redaelli","date":"2019-12-12","format":false,"excerpt":"Hand-Drawn Border Buttons in CSS From: Hand-Drawn Border Buttons in CSS \u2013 \u2102\ud835\udd60\ud835\udd55\ud835\udd56\ud835\udd44\ud835\udd6a\ud835\udd4c\ud835\udd40 I know I will try this style sooner or later in a WordPress theme, eventually coupled with a old-style typewriter font. Hand-Drawn Border Buttons in CSS From: Hand-Drawn Border Buttons in CSS \u2013 \u2102\ud835\udd60\ud835\udd55\ud835\udd56\ud835\udd44\ud835\udd6a\ud835\udd4c\ud835\udd40 I know I\u2026","rel":"","context":"In &quot;Themes&quot;","block_context":{"text":"Themes","link":"https:\/\/monodes.com\/predaelli\/category\/themes\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":6313,"url":"https:\/\/monodes.com\/predaelli\/2019\/12\/12\/comicbook-inspired-hand-drawn-borders-%e2%84%82%f0%9d%95%a0%f0%9d%95%95%f0%9d%95%96%f0%9d%95%84%f0%9d%95%aa%f0%9d%95%8c%f0%9d%95%80\/","url_meta":{"origin":14555,"position":2},"title":"Comicbook Inspired Hand Drawn Borders \u2013 \u2102\ud835\udd60\ud835\udd55\ud835\udd56\ud835\udd44\ud835\udd6a\ud835\udd4c\ud835\udd40","author":"Paolo Redaelli","date":"2019-12-12","format":false,"excerpt":"Comicbook Inspired Hand Drawn Borders \u2013 \u2102\ud835\udd60\ud835\udd55\ud835\udd56\ud835\udd44\ud835\udd6a\ud835\udd4c\ud835\udd40 \u00a0 Here are some pure CSS borders that looks like it was pulled from a comic book, it has got that distinct hand-drawn look and feel to it. If you are going for a comic book inspired layout for your page you will\u2026","rel":"","context":"In &quot;Themes&quot;","block_context":{"text":"Themes","link":"https:\/\/monodes.com\/predaelli\/category\/themes\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":14169,"url":"https:\/\/monodes.com\/predaelli\/2025\/10\/24\/how-to-emulate-hand-drawn-shapes-algorithms-behind-roughjs-shihn-ca\/","url_meta":{"origin":14555,"position":3},"title":"How to emulate hand-drawn shapes \/ Algorithms behind RoughJS | shihn.ca","author":"Paolo Redaelli","date":"2025-10-24","format":false,"excerpt":"How to emulate hand-drawn shapes \/ Algorithms behind RoughJS | shihn.ca A dive into graphics algorithms used in RoughJS - A graphics library that lets you draw in a sketchy, hand-drawn-like, style. How to emulate hand-drawn shapes \/ Algorithms behind RoughJS A dive into graphics algorithms used in RoughJS -\u2026","rel":"","context":"In &quot;Documentations&quot;","block_context":{"text":"Documentations","link":"https:\/\/monodes.com\/predaelli\/category\/documentations\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/monodes.com\/predaelli\/wp-content\/uploads\/sites\/4\/2025\/10\/cover.png?fit=480%2C480&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":14587,"url":"https:\/\/monodes.com\/predaelli\/2025\/12\/31\/felice-san-silvestro\/","url_meta":{"origin":14555,"position":4},"title":"Felice San Silvestro!","author":"Paolo Redaelli","date":"2025-12-31","format":false,"excerpt":"","rel":"","context":"In &quot;Fun&quot;","block_context":{"text":"Fun","link":"https:\/\/monodes.com\/predaelli\/category\/fun\/"},"img":{"alt_text":"Sylvester the cat drawn as a catholic saint in a golden mosaic","src":"https:\/\/i0.wp.com\/monodes.com\/predaelli\/wp-content\/uploads\/sites\/4\/2025\/12\/5956286115708865467_1212343336006083925359.jpg?fit=963%2C1200&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/monodes.com\/predaelli\/wp-content\/uploads\/sites\/4\/2025\/12\/5956286115708865467_1212343336006083925359.jpg?fit=963%2C1200&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/monodes.com\/predaelli\/wp-content\/uploads\/sites\/4\/2025\/12\/5956286115708865467_1212343336006083925359.jpg?fit=963%2C1200&ssl=1&resize=525%2C300 1.5x, https:\/\/i0.wp.com\/monodes.com\/predaelli\/wp-content\/uploads\/sites\/4\/2025\/12\/5956286115708865467_1212343336006083925359.jpg?fit=963%2C1200&ssl=1&resize=700%2C400 2x"},"classes":[]},{"id":9226,"url":"https:\/\/monodes.com\/predaelli\/2022\/04\/02\/excalidraw-online-whiteboard-collaboration-made-easy\/","url_meta":{"origin":14555,"position":5},"title":"Excalidraw+ | Online whiteboard collaboration made easy","author":"Paolo Redaelli","date":"2022-04-02","format":false,"excerpt":"Whiteboarding tool with hand drawn like experience. Ideal for conducting interviews, drawing diagrams, prototypes or sketches and much more! Source: Excalidraw+ | Online whiteboard collaboration made easy Go to https:\/\/excalidraw.com\/ Sources on https:\/\/github.com\/excalidraw\/excalidraw","rel":"","context":"In &quot;Senza categoria&quot;","block_context":{"text":"Senza categoria","link":"https:\/\/monodes.com\/predaelli\/category\/senza-categoria\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]}],"jetpack_likes_enabled":true,"_links":{"self":[{"href":"https:\/\/monodes.com\/predaelli\/wp-json\/wp\/v2\/posts\/14555","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/monodes.com\/predaelli\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/monodes.com\/predaelli\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/monodes.com\/predaelli\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/monodes.com\/predaelli\/wp-json\/wp\/v2\/comments?post=14555"}],"version-history":[{"count":2,"href":"https:\/\/monodes.com\/predaelli\/wp-json\/wp\/v2\/posts\/14555\/revisions"}],"predecessor-version":[{"id":14561,"href":"https:\/\/monodes.com\/predaelli\/wp-json\/wp\/v2\/posts\/14555\/revisions\/14561"}],"wp:attachment":[{"href":"https:\/\/monodes.com\/predaelli\/wp-json\/wp\/v2\/media?parent=14555"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/monodes.com\/predaelli\/wp-json\/wp\/v2\/categories?post=14555"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/monodes.com\/predaelli\/wp-json\/wp\/v2\/tags?post=14555"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}