diff --git a/packages/docs/client-mdx-components.js b/packages/docs/client-mdx-components.js
index aae327a0..185ac785 100644
--- a/packages/docs/client-mdx-components.js
+++ b/packages/docs/client-mdx-components.js
@@ -4,7 +4,7 @@ import { Align, Light, Anim, Camera, Collision, GSplat, Script, Render, RigidBod
 
 import ReactQueryProvider from '@docs-components/ReactQueryProvider'
 
-import EnvAtlasComponent from '@components/EnvAtlas'
+import EnvironmentLighting from '@/components/EnvironmentLighting'
 import Grid from '@components/Grid'
 import PostEffects, { StaticPostEffects} from '@components/PostEffects'
 import ShadowCatcher from '@components/ShadowCatcher'
@@ -23,7 +23,7 @@ export const defaultComponents = {
     Entity,
     Align, Anim, Camera, Collision, GSplat, Script, Render, RigidBody, Light, Environment,
     OrbitControls,
-    EnvAtlasComponent,
+    EnvironmentLighting,
     Grid,
     ShadowCatcher,
     PostEffects,
diff --git a/packages/docs/components/EnvAtlas.tsx b/packages/docs/components/EnvironmentLighting.tsx
similarity index 63%
rename from packages/docs/components/EnvAtlas.tsx
rename to packages/docs/components/EnvironmentLighting.tsx
index 8b08ab82..84a9caa0 100644
--- a/packages/docs/components/EnvAtlas.tsx
+++ b/packages/docs/components/EnvironmentLighting.tsx
@@ -4,13 +4,13 @@ import React, { FC, ComponentProps } from "react";
 import { useEnvAtlas } from "./hooks/use-asset";
 import { Environment } from "@playcanvas/react/components";
 
-type EnvAtlasComponentsProps = ComponentProps<typeof Environment> & {
-    src: string;
+type EnvironmentLightingProps = ComponentProps<typeof Environment> & {
+    src?: string;
     intensity?: number;
 }
 
- const EnvAtlasComponent: FC<EnvAtlasComponentsProps> = ({ 
-    src, 
+ const EnvironmentLighting: FC<EnvironmentLightingProps> = ({ 
+    src = '/environment-map.png', 
     intensity = 1, 
     ...props 
 }) => {
@@ -21,4 +21,4 @@ type EnvAtlasComponentsProps = ComponentProps<typeof Environment> & {
 
 }
 
-export default EnvAtlasComponent;
\ No newline at end of file
+export default EnvironmentLighting;
\ No newline at end of file
diff --git a/packages/docs/content/docs/guide/getting-started.mdx b/packages/docs/content/docs/guide/getting-started.mdx
index 06c8be89..947c5d95 100644
--- a/packages/docs/content/docs/guide/getting-started.mdx
+++ b/packages/docs/content/docs/guide/getting-started.mdx
@@ -24,7 +24,7 @@ Here's what it should look like...
 <ReactQueryProvider>
     <Application >
         {/* Create some environment lighting */}
-        <EnvAtlasComponent src='/environment-map.png' intensity={0.8}/>
+        <EnvironmentLighting intensity={0.8}/>
         {/* Render the background grid */}
         <Grid />
         {/* Add a shadow catcher to catch the shadows from the model */}
@@ -183,7 +183,7 @@ import { OrbitControls } from '@playcanvas/react/scripts'
 export default function App() {
     return <Application>
         {/* Create some environment lighting */}
-        <EnvAtlasComponent src='/environment-map.png' />
+        <EnvironmentLighting/>
         {/* Render the background grid */}
         <Grid />
         {/* Add a shadow catcher to catch the shadows from the model */}
diff --git a/packages/docs/content/examples/environment.mdx b/packages/docs/content/examples/environment.mdx
index d392412a..3de6b2bd 100644
--- a/packages/docs/content/examples/environment.mdx
+++ b/packages/docs/content/examples/environment.mdx
@@ -13,7 +13,7 @@ export const Example = () => {
     return (<Entity>
         {/* Create some environment lighting */}
         <Environment 
-            type="dome" 
+            type="dome"
             envAtlas={envAtlas} 
             skybox={skybox} 
             exposure={0.75}
diff --git a/packages/docs/content/examples/hello-world.mdx b/packages/docs/content/examples/hello-world.mdx
index 72e89a9e..36c5dcb2 100644
--- a/packages/docs/content/examples/hello-world.mdx
+++ b/packages/docs/content/examples/hello-world.mdx
@@ -8,7 +8,7 @@ export const HelloWorld = () => {
     return <Entity>
 
         {/* Add an environment atlas to the scene */}
-        <EnvAtlasComponent src='/environment-map.png'/>
+        <EnvironmentLighting />
 
         {/* Render the background grid */}
         <Grid />
diff --git a/packages/docs/content/examples/load-a-3D-model.mdx b/packages/docs/content/examples/load-a-3D-model.mdx
index 9e9a31d4..99f77272 100644
--- a/packages/docs/content/examples/load-a-3D-model.mdx
+++ b/packages/docs/content/examples/load-a-3D-model.mdx
@@ -13,8 +13,8 @@ export const LoadingGLB = () => {
     if(!asset) return null;
 
     return <Entity>
-
-        <EnvAtlasComponent src='/environment-map.png' intensity={2}/>
+        {/* Create some environment lighting */}
+        <EnvironmentLighting intensity={2}/>
 
         {/* Render the background grid */}
         <Grid />
diff --git a/packages/docs/content/examples/model-viewer.mdx b/packages/docs/content/examples/model-viewer.mdx
index c3cd0656..b6336a14 100644
--- a/packages/docs/content/examples/model-viewer.mdx
+++ b/packages/docs/content/examples/model-viewer.mdx
@@ -8,7 +8,7 @@ export const ModelViewer = () => {
 
     return (<Entity>
         {/* Create some environment lighting */}
-        <EnvAtlasComponent src='/environment-map.png' />
+        <EnvironmentLighting />
 
         {/* Render the background grid */}
         <Grid />
diff --git a/packages/docs/content/examples/motion.mdx b/packages/docs/content/examples/motion.mdx
index 4de4b0e8..322b69ab 100644
--- a/packages/docs/content/examples/motion.mdx
+++ b/packages/docs/content/examples/motion.mdx
@@ -45,7 +45,7 @@ export const Example = () => {
         </Entity>
 
         {/* Create some environment lighting */}
-        <EnvAtlasComponent src='/environment-map.png' intensity={0.4}/>
+        <EnvironmentLighting intensity={0.4}/>
 
         {/* Create some additional lighting */}
         <Entity rotation={[0, -45, 23]}>
diff --git a/packages/docs/content/examples/physics.mdx b/packages/docs/content/examples/physics.mdx
index 784cf585..c1c0ff0a 100644
--- a/packages/docs/content/examples/physics.mdx
+++ b/packages/docs/content/examples/physics.mdx
@@ -77,7 +77,7 @@ export const Physics = () => {
 
     return (<Entity>
         
-        <EnvAtlasComponent src='/environment-map.png' />
+        <EnvironmentLighting/>
 
         {/* Create a camera */}
         <Entity name='camera' position={[0, 0, 20]} >
diff --git a/packages/docs/content/examples/pointer-events.mdx b/packages/docs/content/examples/pointer-events.mdx
index 8b2e6b25..87b66b00 100644
--- a/packages/docs/content/examples/pointer-events.mdx
+++ b/packages/docs/content/examples/pointer-events.mdx
@@ -22,7 +22,7 @@ export const PointerEvents = () => {
 
     return <Entity>
 
-        <EnvAtlasComponent src='/environment-map.png' intensity={2}/>
+        <EnvironmentLighting intensity={2}/>
 
         {/* Render the background grid */}
         <Grid />
diff --git a/packages/docs/content/examples/scripting.mdx b/packages/docs/content/examples/scripting.mdx
index f93dab0c..2703989c 100644
--- a/packages/docs/content/examples/scripting.mdx
+++ b/packages/docs/content/examples/scripting.mdx
@@ -2,19 +2,16 @@ export const Demo = () => {
     /**
      * A simple glb viewer with a shadow catcher and auto rotate.
      */
-
     const { data: asset } = useModel('/lamborghini_vision_gt.glb')
 
     return (<Entity>
         {/* Create some environment lighting */}
-        <EnvAtlasComponent src='/environment-map.png' />
-        {/* Render the background grid */}
+        <EnvironmentLighting/>
         
         {/* Create a camera entity */}
         <Entity name='camera' position={[4, 1, 4]}>
             <Camera renderSceneColorMap={true} />
             <OrbitControls inertiaFactor={0.07} distanceMin={6} distanceMax={10} pitchAngleMin={1} pitchAngleMax={90}/>
-            
         </Entity>
 
         <Entity scale={[0.5, 0.5, 0.5]}>
diff --git a/packages/docs/content/examples/splats.mdx b/packages/docs/content/examples/splats.mdx
index 371d1572..fe0c650d 100644
--- a/packages/docs/content/examples/splats.mdx
+++ b/packages/docs/content/examples/splats.mdx
@@ -7,9 +7,6 @@ export const Example = () => {
     const { data: splat } = useSplat(splatURL);
 
     return <Entity>
-        {/* Create a camera entity */}
-        <EnvAtlasComponent src='/environment-map.png' />
-
         <Entity>
             <Camera fov={30} />
             { splat && <OrbitControls