{"id":8874,"date":"2024-05-17T10:33:59","date_gmt":"2024-05-17T09:33:59","guid":{"rendered":"https:\/\/www.katsbits.com\/codex\/?p=8874"},"modified":"2024-05-17T10:33:59","modified_gmt":"2024-05-17T09:33:59","slug":"shadeless-materials","status":"publish","type":"post","link":"https:\/\/www.katsbits.com\/codex\/shadeless-materials\/","title":{"rendered":"Simple &#8216;Shadeless&#8217; (Flat Lit) Materials In Blender"},"content":{"rendered":"<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_83 counter-hierarchy ez-toc-counter ez-toc-light-blue ez-toc-container-direction\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Table of Contents<\/p>\n<label for=\"ez-toc-cssicon-toggle-item-6a15b59052ab2\" class=\"ez-toc-cssicon-toggle-label\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/label><input type=\"checkbox\"  id=\"ez-toc-cssicon-toggle-item-6a15b59052ab2\"  aria-label=\"Toggle\" \/><nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/www.katsbits.com\/codex\/shadeless-materials\/#shadeless-node-setup\" >Shadeless Node Setup<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/www.katsbits.com\/codex\/shadeless-materials\/#image-texture-or-base-color\" >Image Texture or Base Color<\/a><ul class='ez-toc-list-level-4' ><li class='ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/www.katsbits.com\/codex\/shadeless-materials\/#base-color\" >Base Color<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/www.katsbits.com\/codex\/shadeless-materials\/#image-texture\" >Image Texture<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/www.katsbits.com\/codex\/shadeless-materials\/#shaderless-cycles\" >Shaderless &#038; Cycles<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/www.katsbits.com\/codex\/shadeless-materials\/#shaderless-blender-4x\" >Shaderless &#038; Blender 4.(X)<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/www.katsbits.com\/codex\/shadeless-materials\/#export-shadeless-materials\" >Export Shadeless Materials<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/www.katsbits.com\/codex\/shadeless-materials\/#toon-shader\" >Toon Shader<\/a><\/li><\/ul><\/nav><\/div>\n<p>In legacy versions of Blender is was possible to create materials that didn&#8217;t respond to scene lighting by enabling the  <strong>Shadeless<\/strong> option within the Materials properties. The effect of this meant materials then rendered shadeless, or flat lit\/full bright because scene lighting had no affected on the mesh self-shading (but not shadows). As this setting is no longer available it has to be achieved indirectly using an <strong>Emission<\/strong> node.<\/p>\n<blockquote><p><strong>Design note<\/strong>: <em>shading vs shadows<\/em> &#8211; <strong>Shading<\/strong> only affects objects and surfaces locally (self) and refers to the way meshes discolour, or <strong>self-shade<\/strong>, relative to light source; structure further away or obscured from a light source, appears darker than those closer facing. This helps delineate the three-dimensional structure of individual objects. Shadows on the other hand affect everything in a scene (global) and are typically projected relative to a light source. They help describe an objects shape and position relative to an environment.<\/p><\/blockquote>\n<blockquote style=\"background-color: #ddecf3; color: #000;\"><p><b>Download<\/b>: <a href=\"https:\/\/www.katsbits.com\/files\/tutorials\/katsbits - shaderless material.zip\">KatsBits &#8211; Shaderless Material<\/a> (c. 500 KB | *.blend, *.tga).<\/p><\/blockquote>\n<h3><span class=\"ez-toc-section\" id=\"shadeless-node-setup\"><\/span>Shadeless Node Setup<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>To set up a Shaderless material in Blender in either <strong>Material Preview<\/strong> or <strong>Rendered<\/strong> display mode, in <strong>Shading Workspace<\/strong> first create a standard material with the necessary properties and image assets, for example a <em>Principled BSDF<\/em> with a <em>Base Color<\/em> linked to <em>Material Output<\/em>. To this arrangement, from the <strong>Add<\/strong> [1] menu select <strong>Shader<\/strong> then drop in a <strong>Mix Shader<\/strong> node and an <strong>Emission<\/strong> node &#8211; <strong><em>Add \u00bb Shader \u00bb Mix Shader<\/em><\/strong> and <strong><em>Add \u00bb Shader \u00bb Emission<\/em><\/strong> [2].<\/p>\n<blockquote style=\"background-color: #fc0; color: #000;\"><p><strong>Important<\/strong>: in this context the <strong>Emission<\/strong> property of <strong>Principled BSDF<\/strong> won&#8217;t work due to the way this would otherwise result in an incorrectly structured material hieratical.<\/p><\/blockquote>\n<p>Next, to the <strong>Shader<\/strong> inputs of the <em>Mix Shader<\/em>, link the <strong>BSDF<\/strong> output of <em>Principled BSDF<\/em> to one, and the <strong>Emission<\/strong> output of <em>Emission<\/em> to the other. This mixes the two inputs together based on the Fac value, 0.500 so 50\/50. Finally, link the <strong>Shader<\/strong> output from the <em>Mix Shader<\/em> to the <strong>Surface<\/strong> input of the <em>Material Output<\/em> node.<\/p>\n<p><a href=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/shaderless-nodes.jpg\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" style=\"width: 100%; height: auto;\" src=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/shaderless-nodes.jpg\" alt=\"Emission nodes\" width=\"900px\" height=\"500px\" border=\"0\" \/><\/a><br \/>\n<i>The basic nodes needed for a simple <strong>Shaderless<\/strong> materials; in Shading workspace Add [1] an <strong>Emission<\/strong> and <strong>Mix Shader<\/strong> [2] node.<\/i><\/p>\n<p><a href=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/shaderless-node-tree.jpg\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" style=\"width: 100%; height: auto;\" src=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/shaderless-node-tree.jpg\" alt=\"Shaderless Node tree\" width=\"900px\" height=\"500px\" border=\"0\" \/><\/a><br \/>\n<i>Link the nodes together to Principled BSDF (<strong>BSDF<\/strong> output) and Emission (<strong>Emission<\/strong> output) are connected to the Mix Shader (<strong>Shader<\/strong> output) [3], which in turn links through to Material Output (<strong>Surface<\/strong> input).<\/i><\/p>\n<h3><span class=\"ez-toc-section\" id=\"image-texture-or-base-color\"><\/span>Image Texture or Base Color<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Once the nodes have been connected, depending on what should be rendered as the <em>surface<\/em> or <em>diffuse<\/em>\/<em>color<\/em> aspect of the material visible in the scene, the node setup and properties might need adjustment.<\/p>\n<blockquote style=\"background-color: #fc0; color: #000;\"><p><strong>Important<\/strong>: the nature of emission in the context means it may completely overwhelm any other properties, images or effects associated with the overall material, for example <a href=\"https:\/\/www.katsbits.com\/codex\/tag\/normal-map\/\">normal maps<\/a> rely on light sources to function, with Emission in place this may nullify the effect.<\/p><\/blockquote>\n<h4><span class=\"ez-toc-section\" id=\"base-color\"><\/span>Base Color<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>If the materials diffuse is just a color set in Principled BSDF using <strong>Base Color<\/strong> [4], first take note of the colour values, e.g. RGB 0.800\/0.500\/0.000 (yellow-ish orange), then in the <em>Emission<\/em> node change <strong>Color<\/strong> [5] to similarly mirror <strong>Base Color<\/strong>, i.e. both <em>Base Color<\/em> and <em>Color<\/em> values would be RGB 0.800\/0.500\/0.000. Once done, depending on how shaderless the material needs to be, change <strong>Fac<\/strong>(tor) to <strong>0.000<\/strong> for the full shaderless effect [6].<\/p>\n<blockquote><p><strong>Design note<\/strong>: setting up shaderless materials in this way effectively nullifies the Base Color input of Principled BSDF, especially when Fac is fully engaged, so it can be disconnected unless other shader properties are in used.<\/p><\/blockquote>\n<p><a href=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/shaderless-color.jpg\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" style=\"width: 100%; height: auto;\" src=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/shaderless-color.jpg\" alt=\"Emission Color\" width=\"900px\" height=\"500px\" border=\"0\" \/><\/a><br \/>\n<a href=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/shaderless-color-fac.jpg\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" style=\"width: 100%; height: auto;\" src=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/shaderless-color-fac.jpg\" alt=\"Mix Shader Fac\" width=\"900px\" height=\"500px\" border=\"0\" \/><\/a><br \/>\n<i>Image-top: if using Base Color for the material [4], the values need to be mirrored in the Emission node [5] &#8211; this overrides Principled BSDF. Image-bottom: once the colour is mirrored, to get the full shderless effect set the <strong>Fac<\/strong> value on the Mix Shader node to <strong>0.000<\/strong> &#8211; self-shading will be effectively disabled.<\/i><\/p>\n<h4><span class=\"ez-toc-section\" id=\"image-texture\"><\/span>Image Texture<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>If a materials surface appearance is defined by a bitmap associated with an <strong>Image Texture<\/strong> node that&#8217;s linked through Principled BSDF, in the <em>Image Texture<\/em> node disconnect <strong>Color<\/strong> output and (re)connect to it to the <strong>Color<\/strong> input of the <em>Emission<\/em> node [7] &#8211; this determines the colours seen in the scene. Then depending on the degree of shaderlessness, change <strong>Fac<\/strong> on the <em>Mix Shader<\/em> to <strong>0.000<\/strong> [8], enabling the full, image defined, shaderless effect.<\/p>\n<blockquote><p><strong>Design note<\/strong>: using Emission in this way nullifies other material effects that might be associated with Principled BSDF, so it can be disconnected without issue.<\/p><\/blockquote>\n<p><a href=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/shaderless-image-texture.jpg\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" style=\"width: 100%; height: auto;\" src=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/shaderless-image-texture.jpg\" alt=\"Shaderless Image Texture\" width=\"900px\" height=\"500px\" border=\"0\" \/><\/a><br \/>\n<a href=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/shaderless-image-texture-fac.jpg\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" style=\"width: 100%; height: auto;\" src=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/shaderless-image-texture-fac.jpg\" alt=\"Shaderless images\" width=\"900px\" height=\"500px\" border=\"0\" \/><\/a><br \/>\n<i>Image-top: for materials with diffuse defined by an Image texture node and associated image, link Color output to the Color input of Emission [7]. Image-bottom, set <strong>Fac<\/strong> to <strong>0.000<\/strong> in the Mix Shader to fully enable the shaderless effect &#8211; self-shading will be similarly nullified along with other material effects.<\/i><\/p>\n<h3><span class=\"ez-toc-section\" id=\"shaderless-cycles\"><\/span>Shaderless &#038; Cycles<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>For basic shaderless materials in Cycles render engine no special set up is needed, the same nodes and connections will function for both EEVEE and Cycles.<\/p>\n<p><a href=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/shaderless-cycles.jpg\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" style=\"width: 100%; height: auto;\" src=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/shaderless-cycles.jpg\" alt=\"Shaderless Cycles\" width=\"900px\" height=\"500px\" border=\"0\" \/><\/a><br \/>\n<i>The setup for shaderless materials in EEVEE also work without modification in Cycles [9] render engine.<\/i><\/p>\n<h3><span class=\"ez-toc-section\" id=\"shaderless-blender-4x\"><\/span>Shaderless &#038; Blender 4.(X)<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>No special setup or modification of a basic shaderless material is needed for Blender 4.(x) or above.<\/p>\n<p><a href=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/shaderless-blender-newer.jpg\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" style=\"width: 100%; height: auto;\" src=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/shaderless-blender-newer.jpg\" alt=\"Shaderless Blender 4.(x)\" width=\"900px\" height=\"500px\" border=\"0\" \/><\/a><br \/>\n<i>Shaderless materials don&#8217;t need any special setup or modification to work in Blender 4.(x).<\/i><\/p>\n<h3><span class=\"ez-toc-section\" id=\"export-shadeless-materials\"><\/span>Export Shadeless Materials<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>While it is possible to export shadeless materials from Blender when they&#8217;re assigned to a mesh object, imported into third-party applications, files may be not work due to any number of organisational and\/or technical differences between Blender and the app being used. In other words, although the third-part environment may have an <em>Emission<\/em> effect, using it for shaderless materials might conflict with a proprietary system available for that purpose, or confuse an existing Emission system due to the way Blender has configured or organised the Emission node within the file. Some testing then, may be necessary.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"toon-shader\"><\/span>Toon Shader<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>A shaderless material can be used to create a simple and cheap &#8216;<em>toon outline<\/em>&#8216; shader effect. To do this, first make a duplicate of the object to be toon shaded and increase its size (<span class=\"shortcutkey\">S<\/span>) relative to the width of the line desired, e.g. <em>Scale: x 1.25<\/em>. Next, add a material and set the <strong>Base Color<\/strong> as desired for the outline, e.g. black or RGB 0\/0\/0, then scroll down and click the check box for <strong>Backface Culling<\/strong> [10] to enable, and set <strong>Shadow Mode<\/strong> to <strong>None<\/strong> [11]. Finally, in <strong>Edit Mode<\/strong> select the mesh and invert the faces using <strong>Flip<\/strong> [12] &#8211; <strong><em>Mesh \u00bb Normals \u00bb Flip<\/em><\/strong>.<\/p>\n<blockquote><p><strong>Design note<\/strong>: <strong>Backface Culling<\/strong> disable both sides of the mesh being rendered and setting <strong>Shadow Mode<\/strong> to <strong>None<\/strong> prevents the outline object casting shadows onto other objects in the scene.<\/p><\/blockquote>\n<p>Once the outline object(s) is prepped, in <strong>Shading Workspace<\/strong> update the materials node tree relative to basing the effect on either a <a href=\"https:\/\/www.katsbits.com\/codex\/basic-shadeless-materials\/#base-color\">Base Color<\/a> or <a href=\"https:\/\/www.katsbits.com\/codex\/basic-shadeless-materials\/#image-texture\">Image Texture<\/a> node, e.g. set the Emission nodes <strong>Color<\/strong> [13] to &#8216;black&#8217;, <strong>RGB<\/strong>\/<strong>HSV 0.000<\/strong>, and then <strong>Fac<\/strong> on the Mix Shader to <strong>0.000<\/strong> [14]. This then results in a &#8216;toon outline&#8217; around a parent object that does not cast shadows, does not react to scene or object lighting\/illumination, and outlines relative to the viewer\/camera.<\/p>\n<p><a href=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/shaderless-toon-backface.jpg\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" style=\"width: 100%; height: auto;\" src=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/shaderless-toon-backface.jpg\" alt=\"Toon Shader Backface Culling\" width=\"900px\" height=\"500px\" border=\"0\" \/><\/a><br \/>\n<i>Once a basic material is assigned make sure that <strong>Backface Culling<\/strong> is enabled [10], <strong>Shadow Mode<\/strong> is set to None [11], before then inverting the object using <strong>Flip<\/strong> [12] (turns mesh inside out) &#8211; the object will still react to scene\/object lighting at this point.<\/i><\/p>\n<p><a href=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/shaderless-toon-nodes.jpg\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" style=\"width: 100%; height: auto;\" src=\"https:\/\/www.katsbits.com\/images\/tutorials\/materials\/shaderless-toon-nodes.jpg\" alt=\"Toon Shader Nodes\" width=\"900px\" height=\"500px\" border=\"0\" \/><\/a><br \/>\n<i>Once the outline object is prepped, in Shading Workspace set up the node tree as described above, e.g. set the Emission nodes <strong>Color<\/strong> to &#8216;black&#8217; [13] then the Mix Shaders <strong>Fac<\/strong> [14] value to 0.000 enabling the full shaderless outline effect.<\/i><\/p>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":8891,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[34,230],"tags":[558,949,72,865,777,103,564,388,1088,519,1089,973],"class_list":["post-8874","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-blender","category-tutorials","tag-backface-culling","tag-emission","tag-export","tag-flip","tag-material-nodes","tag-materials","tag-mix-shader","tag-principled-bsdf","tag-shaderless","tag-shading-workspace","tag-shadow-mode","tag-toon"],"post_mailing_queue_ids":[],"_links":{"self":[{"href":"https:\/\/www.katsbits.com\/codex\/wp-json\/wp\/v2\/posts\/8874","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.katsbits.com\/codex\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.katsbits.com\/codex\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.katsbits.com\/codex\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.katsbits.com\/codex\/wp-json\/wp\/v2\/comments?post=8874"}],"version-history":[{"count":18,"href":"https:\/\/www.katsbits.com\/codex\/wp-json\/wp\/v2\/posts\/8874\/revisions"}],"predecessor-version":[{"id":8896,"href":"https:\/\/www.katsbits.com\/codex\/wp-json\/wp\/v2\/posts\/8874\/revisions\/8896"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.katsbits.com\/codex\/wp-json\/wp\/v2\/media\/8891"}],"wp:attachment":[{"href":"https:\/\/www.katsbits.com\/codex\/wp-json\/wp\/v2\/media?parent=8874"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.katsbits.com\/codex\/wp-json\/wp\/v2\/categories?post=8874"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.katsbits.com\/codex\/wp-json\/wp\/v2\/tags?post=8874"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}