# Terrain outline

**URL:** <https://forum.babylonjs.com/t/terrain-outline/50042>\
**Category:** Questions\
**Created:** [April 26, 2024, 8:50am UTC](https://forum.babylonjs.com/t/terrain-outline/50042 "2024-04-26T08:50:06Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Stasiek](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/stasiek/32/39319_2.png) [@Stasiek](https://forum.babylonjs.com/u/Stasiek)\
**Post date:** [April 26, 2024, 8:50am UTC](https://forum.babylonjs.com/t/terrain-outline/50042/1 "2024-04-26T08:50:06Z")

</div>

Hi!  
Is it possible to achive effect like this:  
[https://www.researchgate.net/profile/Steve-Duebel/publication/313530750/figure/fig3/AS:669690716237841@1536678117587/Strategies-for-terrain-a-Line-drawing-provides-an-overview-of-basic-terrain-features.ppm](https://www.researchgate.net/profile/Steve-Duebel/publication/313530750/figure/fig3/AS:669690716237841@1536678117587/Strategies-for-terrain-a-Line-drawing-provides-an-overview-of-basic-terrain-features.ppm)  
on the ground?  
Mean, I would like to achieve something like hand-drawing effect.

> **[Babylon.js Playground](https://playground.babylonjs.com/#BRMA8J)**
>
> Babylon.js playground is a live editor for Babylon.js WebGL 3D scenes

---

<div class="post-metadata">

**Author:** ![Tricotou](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/tricotou/32/5844_2.png) [@Tricotou](https://forum.babylonjs.com/u/Tricotou)\
**Post date:** [April 26, 2024, 9:51am UTC](https://forum.babylonjs.com/t/terrain-outline/50042/2 "2024-04-26T09:51:22Z")

</div>

Hello 🙂

There are several ways to achieve this :

- Custom material : What you want is basically an edge detection based on normal (material should be white, except on the part where surface is tangential with the camera view). There are a lot of tutorials about the usage of the [Node Material Editor](https://nodematerial-editor.babylonjs.com/). Example [HERE](https://www.youtube.com/watch?v=YmcZ69xlOjM). When you are done, you can either export the shader code itself, or just save the link, and import it as a material snippet in your code or in the playground

- You can also work at postprocessing level by adding same kind of shader for edge detection. I have done an exemple in this [Playground](https://playground.babylonjs.com/#8V5X7E), based on some other plagrounds I’ve looked here and there.

++  
Tricotou

---

<div class="post-metadata">

**Author:** ![Evgeni\_Popov](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/evgeni_popov/32/4432_2.png) [@Evgeni\_Popov](https://forum.babylonjs.com/u/Evgeni_Popov)\
**Post date:** [April 26, 2024, 9:09pm UTC](https://forum.babylonjs.com/t/terrain-outline/50042/3 "2024-04-26T21:09:20Z")

</div>

It’s not quite the same thing, but you could be interested by a pencil sketching effect:

> **[Babylon.js Playground](https://playground.babylonjs.com/#HAG70C)**
>
> Babylon.js playground is a live editor for Babylon.js WebGL 3D scenes

![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/9/2/92715e6356269b15fe5cf522e3c2d7ab042d29bf.jpeg)