# Apply thickness to THREE.TubeGeometry for border

**URL:** <https://discourse.threejs.org/t/apply-thickness-to-three-tubegeometry-for-border/62431>\
**Category:** Questions\
**Tags:** tube-geometry\
**Created:** [March 7, 2024, 11:56am UTC](https://discourse.threejs.org/t/apply-thickness-to-three-tubegeometry-for-border/62431 "2024-03-07T11:56:39Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![Harshil\_HexaCoder](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/harshil_hexacoder/32/52081_2.png) [@Harshil\_HexaCoder](https://discourse.threejs.org/u/Harshil_HexaCoder)\
**Post date:** [March 7, 2024, 11:56am UTC](https://discourse.threejs.org/t/apply-thickness-to-three-tubegeometry-for-border/62431/1 "2024-03-07T11:56:39Z")

</div>

I am trying to apply border to extruded text geometry but does not get expected result using  
THREE.TubeGeometry.

```javascript
globalOffsetPathPoints.forEach(points => {
      points = points.map(point => new THREE.Vector3(point[0], point[1], 0));
      const curve = new THREE.CatmullRomCurve3(points);
      const radius = 0.8;
      const radialSegments = 2;
      const tubularSegments = 10000;
      const closed = false;
      const geometry = new THREE.TubeGeometry(curve, tubularSegments, radius, radialSegments, closed);
      globalState.styleColor = color
      const material = new THREE.MeshPhysicalMaterial({
        color: color,
        side: THREE.DoubleSide,
        envMap: textureForMaterial,
        envMapIntensity: 1.5,
        metalness: 1,
        roughness: 1
      });
      const tubeMesh = new THREE.Mesh(geometry, material);
      tubeMesh.rotateX(Math.PI)
      })
    })

```

using above code i got result flat surface in xz plane  
 ![Screenshot_38](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/2/1/21369a47440c2138e34e0d6eead32af09bd1bee7.png)

but i want border to look like this in xy plane  
 ![Screenshot_39](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/3/2/32d2e33f4f93e683693d3d376ee76a010492c96c.png)

---

<div class="post-metadata">

**Author:** ![Lawrence3DPK](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/lawrence3dpk/32/29184_2.png) [@Lawrence3DPK](https://discourse.threejs.org/u/Lawrence3DPK)\
**Post date:** [March 8, 2024, 11:35am UTC](https://discourse.threejs.org/t/apply-thickness-to-three-tubegeometry-for-border/62431/2 "2024-03-08T11:35:51Z")

</div>

Try change radial segments to 3 or more?

---

<div class="post-metadata">

**Author:** ![Harshil\_HexaCoder](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/harshil_hexacoder/32/52081_2.png) [@Harshil\_HexaCoder](https://discourse.threejs.org/u/Harshil_HexaCoder)\
**Post date:** [March 11, 2024, 8:31am UTC](https://discourse.threejs.org/t/apply-thickness-to-three-tubegeometry-for-border/62431/3 "2024-03-11T08:31:58Z")

</div>

does not work for show border on the text

---

<div class="post-metadata">

**Author:** ![Lawrence3DPK](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/lawrence3dpk/32/29184_2.png) [@Lawrence3DPK](https://discourse.threejs.org/u/Lawrence3DPK)\
**Post date:** [March 11, 2024, 10:03am UTC](https://discourse.threejs.org/t/apply-thickness-to-three-tubegeometry-for-border/62431/4 "2024-03-11T10:03:18Z")

</div>

Can you share a live setup of your use case as a publicly editable sandbox or codepen?

---

<div class="post-metadata">

**Author:** ![prisoner849](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/prisoner849/32/535_2.png) [@prisoner849](https://discourse.threejs.org/u/prisoner849)\
**Post date:** [March 11, 2024, 11:10am UTC](https://discourse.threejs.org/t/apply-thickness-to-three-tubegeometry-for-border/62431/5 "2024-03-11T11:10:54Z")

</div>

> [@Harshil\_HexaCoder](#):
>
> does not work for show border on the text

Works well for me, when I set `radialSegments` parameter of `TubeGeometry` to 16 🤔

 ![изображение](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/9/7/97866727ea8345a1b3462c267506e79a0f68f735.jpeg)

---

<div class="post-metadata">

**Author:** ![Harshil\_HexaCoder](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/harshil_hexacoder/32/52081_2.png) [@Harshil\_HexaCoder](https://discourse.threejs.org/u/Harshil_HexaCoder)\
**Post date:** [March 18, 2024, 5:15am UTC](https://discourse.threejs.org/t/apply-thickness-to-three-tubegeometry-for-border/62431/6 "2024-03-18T05:15:20Z")

</div>

thanks for your efforts but not like that that I also have same result but I want make border look flat not rounded

---

<div class="post-metadata">

**Author:** ![prisoner849](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/prisoner849/32/535_2.png) [@prisoner849](https://discourse.threejs.org/u/prisoner849)\
**Post date:** [March 18, 2024, 8:02am UTC](https://discourse.threejs.org/t/apply-thickness-to-three-tubegeometry-for-border/62431/7 "2024-03-18T08:02:32Z")

</div>

> [@Harshil\_HexaCoder](#):
>
> I want make border look flat not rounded

Try `ExtrudeGeometry` 🤔

 ![изображение](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/c/d/cddae18cf73bbed093d4bbc6b43512905a887d35.png)