{"id":31923,"date":"2026-11-12T10:00:50","date_gmt":"2026-11-12T09:00:50","guid":{"rendered":"https:\/\/www.justcolor.net\/kids\/pixel-coloring\/"},"modified":"2026-11-12T10:00:50","modified_gmt":"2026-11-12T09:00:50","slug":"pixel-coloring","status":"publish","type":"page","link":"https:\/\/www.justcolor.net\/kids\/pixel-coloring\/","title":{"rendered":"Pixel art \u00e0 colorier en ligne : cr\u00e9ez votre coloriage pixel art gratuit"},"content":{"rendered":"<div class=\"jc-pixel-art\" id=\"jc-pixel-art\"><div class=\"page\">\n  <div class=\"title-row\"><h1 class=\"entry-title\">Pixel Art Coloring: turn any picture into a pixel art coloring page<\/h1><\/div>\n\n  <!-- ============ TEMPS 1 : PR\u00c9PARATION ============ -->\n  <div id=\"jcpa-stage-prep\">\n  <p class=\"intro\">Pick a ready-made template or upload your own picture, then color on screen or print your pixel art.<\/p>\n  <div class=\"workspace\">\n  <div class=\"form\">\n    <section class=\"step\">\n      <h2><span class=\"num\">1<\/span>Pick a template or upload a picture<\/h2>\n      <div class=\"models\" id=\"jcpa-models\"><\/div>\n      <div class=\"drop\" id=\"jcpa-drop\">\n        <button id=\"jcpa-pick\" type=\"button\">Upload my picture<\/button>\n        <input type=\"file\" id=\"jcpa-file\" accept=\"image\/*\" hidden>\n        <p class=\"hint\" id=\"jcpa-dropnote\">or drop a file here (JPG, PNG, WebP). Your picture stays on your device.<\/p>\n      <\/div>\n    <\/section>\n\n    <section class=\"step\" id=\"jcpa-step_diff\">\n      <h2><span class=\"num\">2<\/span>Set the difficulty<\/h2>\n      <div class=\"seg\" id=\"jcpa-presets\">\n        <button type=\"button\" data-p=\"facile\">Easy<\/button>\n        <button type=\"button\" data-p=\"moyen\">Medium<\/button>\n        <button type=\"button\" data-p=\"difficile\">Hard<\/button>\n        <button type=\"button\" data-p=\"expert\">Expert<\/button>\n      <\/div>\n      <div class=\"slider\"><label for=\"jcpa-cols\">Grid size<\/label><output id=\"jcpa-o_cols\"><\/output><input type=\"range\" id=\"jcpa-cols\" min=\"12\" max=\"100\" value=\"32\"><\/div>\n      <p class=\"hint\" id=\"jcpa-rec\"><\/p>\n      <p class=\"hint warn\" id=\"jcpa-warn\" hidden><\/p>\n    <\/section>\n\n    <section class=\"step\">\n      <h2><span class=\"num\" id=\"jcpa-num_type\">3<\/span>Choose the coloring type<\/h2>\n      <div class=\"modes\" id=\"jcpa-modes\">\n        <button type=\"button\" class=\"card\" data-m=\"free\"><strong>Free coloring<\/strong><small>Black outlines and white squares. You pick your own colors.<\/small><\/button>\n        <button type=\"button\" class=\"card\" data-m=\"numbers\"><strong>Color by number<\/strong><small>Each square shows the number of its color. The picture appears little by little.<\/small><\/button>\n      <\/div>\n      <details>\n        <summary>Options<\/summary>\n        <div class=\"step\">\n          <label class=\"check\" id=\"jcpa-opt_grid\"><input type=\"checkbox\" id=\"jcpa-grid\" checked> Show the grid<\/label>\n          <label class=\"check\" id=\"jcpa-opt_sw\"><input type=\"checkbox\" id=\"jcpa-swatches\" checked> Suggested colors at the bottom of the printed sheet<\/label>\n          <div class=\"slider\"><label for=\"jcpa-tint\">Helper tint in the squares<\/label><output id=\"jcpa-o_tint\"><\/output><input type=\"range\" id=\"jcpa-tint\" min=\"0\" max=\"60\" value=\"0\" step=\"5\"><\/div>\n        <\/div>\n      <\/details>\n    <\/section>\n  <\/div>\n\n  <div class=\"preview\">\n    <div class=\"stats\" id=\"jcpa-stats\"><\/div>\n    <div class=\"pair\" id=\"jcpa-pair\">\n      <figure><canvas id=\"jcpa-pv1\"><\/canvas><figcaption>Coloring page<\/figcaption><\/figure>\n      <figure><canvas id=\"jcpa-pv2\"><\/canvas><figcaption>Model<\/figcaption><\/figure>\n    <\/div>\n    <button type=\"button\" class=\"primary\" id=\"jcpa-start\">Start coloring<\/button>\n  <\/div>\n  <\/div>\n  <\/div>\n\n  <!-- ============ TEMPS 2 : DESSIN ============ -->\n  <div id=\"jcpa-stage-draw\" hidden>\n    <div class=\"topbar\">\n      <button type=\"button\" id=\"jcpa-back\">\u2190 Change settings<\/button>\n      <div class=\"progress\"><div class=\"bar\"><i id=\"jcpa-barfill\"><\/i><i id=\"jcpa-barerr\" class=\"err\"><\/i><\/div><span id=\"jcpa-pct\">0 %<\/span><span class=\"errs\" id=\"jcpa-errs\" hidden><\/span><\/div>\n      <button type=\"button\" id=\"jcpa-save\"><svg class=\"ic\" viewBox=\"0 0 24 24\" aria-hidden=\"true\"><path d=\"M5 4h11l3 3v13H5z\"\/><path d=\"M8 4v5h7V4\"\/><path d=\"M8 20v-6h8v6\"\/><\/svg>Save<\/button>\n      <button type=\"button\" id=\"jcpa-dl_pdf\"><svg class=\"ic\" viewBox=\"0 0 24 24\" aria-hidden=\"true\"><path d=\"M12 4v11\"\/><path d=\"M7.5 11l4.5 4.5 4.5-4.5\"\/><path d=\"M5 20h14\"\/><\/svg>Download PDF<\/button>\n      <button type=\"button\" id=\"jcpa-dl_png\"><svg class=\"ic\" viewBox=\"0 0 24 24\" aria-hidden=\"true\"><path d=\"M12 4v11\"\/><path d=\"M7.5 11l4.5 4.5 4.5-4.5\"\/><path d=\"M5 20h14\"\/><\/svg>Download PNG<\/button>\n    <\/div>\n    <div class=\"drawopts\">\n      <div class=\"seg dmodes\" id=\"jcpa-dmodes\"><button type=\"button\" data-dm=\"free\">Free coloring<\/button><button type=\"button\" data-dm=\"numbers\">Color by number<\/button><\/div>\n      <label class=\"check strict\" id=\"jcpa-opt_strict\"><input type=\"checkbox\" id=\"jcpa-strict\" checked> Model colors<\/label>\n    <\/div>\n    <div class=\"studio\">\n      <div class=\"side\">\n        <div class=\"thumb\">\n          <div class=\"thumbbox\" id=\"jcpa-thumbbox\"><canvas id=\"jcpa-thumb\"><\/canvas><div id=\"jcpa-viewport\" hidden><\/div><\/div>\n        <\/div>\n      <\/div>\n      <div>\n        <div class=\"paper\" id=\"jcpa-paper\"><canvas id=\"jcpa-view\"><\/canvas><\/div>\n        <div class=\"dock\">\n          <div class=\"tools\" id=\"jcpa-tools\">\n            <button type=\"button\" data-tool=\"pen\" aria-pressed=\"true\"><svg class=\"ic\" viewBox=\"0 0 24 24\" aria-hidden=\"true\"><path d=\"M4 20l1-4L16.5 4.5a2.1 2.1 0 013 3L8 19l-4 1z\"\/><path d=\"M14.5 6.5l3 3\"\/><\/svg>Pencil<\/button>\n            <button type=\"button\" data-tool=\"bucket\"><svg class=\"ic\" viewBox=\"0 0 24 24\" aria-hidden=\"true\"><path d=\"M5 11l7-7 8 8-7 7a2 2 0 01-2.8 0L5 13.8A2 2 0 015 11z\"\/><path d=\"M4.5 12.5h15\"\/><path d=\"M20 16.5c1 1.4 1.5 2.3 1.5 3a1.5 1.5 0 01-3 0c0-.7.5-1.6 1.5-3z\"\/><\/svg>Fill an area<\/button>\n            <button type=\"button\" data-tool=\"eraser\"><svg class=\"ic\" viewBox=\"0 0 24 24\" aria-hidden=\"true\"><path d=\"M8 20l-4.3-4.3a2 2 0 010-2.8L13 3.6a2 2 0 012.8 0l4.6 4.6a2 2 0 010 2.8L11 20z\"\/><path d=\"M8.5 8.1l7.4 7.4\"\/><path d=\"M8 20h12\"\/><\/svg>Eraser<\/button>\n            <button type=\"button\" id=\"jcpa-clear\"><svg class=\"ic\" viewBox=\"0 0 24 24\" aria-hidden=\"true\"><path d=\"M4 7h16\"\/><path d=\"M9 7V4h6v3\"\/><path d=\"M6 7l1 13h10l1-13\"\/><path d=\"M10 11v6M14 11v6\"\/><\/svg>Clear all<\/button>\n          <\/div>\n          <div class=\"tools\">\n            <button type=\"button\" data-tool=\"move\"><svg class=\"ic\" viewBox=\"0 0 24 24\" aria-hidden=\"true\"><path d=\"M12 3v18M3 12h18\"\/><path d=\"M9 6l3-3 3 3M9 18l3 3 3-3M6 9l-3 3 3 3M18 9l3 3-3 3\"\/><\/svg>Move<\/button>\n            <button type=\"button\" id=\"jcpa-zin\"><svg class=\"ic\" viewBox=\"0 0 24 24\" aria-hidden=\"true\"><circle cx=\"11\" cy=\"11\" r=\"6.5\"\/><path d=\"M16 16l4.5 4.5\"\/><path d=\"M8.5 11h5M11 8.5v5\"\/><\/svg>Zoom in<\/button>\n            <button type=\"button\" id=\"jcpa-zout\"><svg class=\"ic\" viewBox=\"0 0 24 24\" aria-hidden=\"true\"><circle cx=\"11\" cy=\"11\" r=\"6.5\"\/><path d=\"M16 16l4.5 4.5\"\/><path d=\"M8.5 11h5\"\/><\/svg>Zoom out<\/button>\n            <button type=\"button\" id=\"jcpa-zfit\"><svg class=\"ic\" viewBox=\"0 0 24 24\" aria-hidden=\"true\"><path d=\"M4 9V4h5M20 9V4h-5M4 15v5h5M20 15v5h-5\"\/><\/svg>Fit<\/button>\n          <\/div>\n          <div class=\"palette\" id=\"jcpa-palette\"><\/div>\n          <p class=\"hint\">Zoom with the scroll wheel, a pinch or the buttons. To move around, press and hold then drag, or use the Move tool.<\/p>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/div>\n<div id=\"jcpa-bravo\" hidden><div><h2>Well done!<\/h2><p>Your pixel art is complete.<\/p><button type=\"button\" class=\"primary\" id=\"jcpa-bravo_close\">Close<\/button><\/div><\/div>\n<div id=\"jcpa-gate\" hidden><div><h2>Create your free account<\/h2><p>A Just Color account is required to download or save your pixel art. Your work in progress is kept.<\/p><a class=\"jcpa-btn\" id=\"jcpa-gate_login\" href=\"#\">Sign in or create an account<\/a><button type=\"button\" id=\"jcpa-gate_close\">Later<\/button><\/div><\/div>\n<div id=\"jcpa-toast\" role=\"status\"><\/div><section class=\"jcpa-seo\"><h2>How do you make a pixel art coloring page?<\/h2><p>Pick one of our templates or upload your own picture: a photo, a drawing, a logo. The tool splits it into small squares and groups similar colors. Then you set the grid size: a small grid gives an easy coloring page for young children, a large grid a detailed pixel art for patient colorists.<\/p><h2>Free coloring or color by number<\/h2><p>With free coloring you get black outlines on a grid, to fill with any colors you like. With color by number, each square carries a number matching a color in the palette: the picture is revealed as you color. Both versions can be colored on screen or printed on an A4 page.<\/p><h2>Frequently asked questions<\/h2><h3>Is the tool free?<\/h3><p>Yes. Creating and coloring on screen is open to everyone. A free Just Color account is all you need to download the PDF or PNG and to save your pixel art.<\/p><h3>Are my photos sent to a server?<\/h3><p>No. The conversion to pixel art happens in your browser. Only the resulting grid is stored if you choose to save it to your account.<\/p><h3>Which grid size should I choose?<\/h3><p>Allow about 16 squares across for a child aged 5 to 7, 24 to 36 squares for a finer coloring page, and up to 100 squares for a highly detailed pixel art.<\/p><\/section><\/div>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"ngg_post_thumbnail":0,"footnotes":""},"tags":[],"class_list":["post-31923","page","type-page","status-publish"],"_links":{"self":[{"href":"https:\/\/www.justcolor.net\/kids\/wp-json\/wp\/v2\/pages\/31923","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.justcolor.net\/kids\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.justcolor.net\/kids\/wp-json\/wp\/v2\/types\/page"}],"replies":[{"embeddable":true,"href":"https:\/\/www.justcolor.net\/kids\/wp-json\/wp\/v2\/comments?post=31923"}],"version-history":[{"count":0,"href":"https:\/\/www.justcolor.net\/kids\/wp-json\/wp\/v2\/pages\/31923\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.justcolor.net\/kids\/wp-json\/wp\/v2\/media?parent=31923"}],"wp:term":[{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.justcolor.net\/kids\/wp-json\/wp\/v2\/tags?post=31923"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}