Tresjs/docs/.vitepress/theme/components/FirstSceneLightToon.vue

<script setup lang="ts">
import { TresCanvas } from '@tresjs/core'
/* import { OrbitControls } from '@tresjs/cientos' */

const styles = {
  width: '100%',
  height: '550px',
  border: '1px solid #e2e2e2',
  borderRadius: '8px',
  overflow: 'hidden',
}
</script>
<template>
  <ClientOnly>
    <TresCanvas shadows clear-color="#fff" :style="styles">
      <TresPerspectiveCamera :position="[0, 2, 4]" />
      <OrbitControls />
      <TresDirectionalLight :position="[0, 2, 4]" :intensity="2" cast-shadow />
      <TresMesh :rotation="[-Math.PI / 4, -Math.PI / 4, Math.PI / 4]">
        <TresTorusGeometry :args="[1, 0.5, 16, 32]" />
        <TresMeshToonMaterial color="#FBB03B" />
      </TresMesh>
    </TresCanvas>
  </ClientOnly>
</template>