diff --git a/react-components/package.json b/react-components/package.json
index 9df91941fde..c70b16d2a1e 100644
--- a/react-components/package.json
+++ b/react-components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@cognite/reveal-react-components",
-  "version": "0.52.2",
+  "version": "0.53.0",
   "exports": {
     ".": {
       "import": "./dist/index.js",
diff --git a/react-components/src/components/CacheProvider/PointCloudAnnotationCacheProvider.tsx b/react-components/src/components/CacheProvider/PointCloudAnnotationCacheProvider.tsx
index 731af7b9a21..4714f7b7114 100644
--- a/react-components/src/components/CacheProvider/PointCloudAnnotationCacheProvider.tsx
+++ b/react-components/src/components/CacheProvider/PointCloudAnnotationCacheProvider.tsx
@@ -9,7 +9,7 @@ import { useSDK } from '../RevealCanvas/SDKProvider';
 import { useRevealKeepAlive } from '../RevealKeepAlive/RevealKeepAliveContext';
 import { PointCloudAnnotationCache } from './PointCloudAnnotationCache';
 import { type PointCloudModelOptions, type TypedReveal3DModel } from '../Reveal3DResources/types';
-import { type AnnotationModelDataResult } from '../../hooks/useCalculatePointCloudModelsStyling';
+import { type AnnotationModelDataResult } from '../Reveal3DResources/useCalculatePointCloudStyling';
 import { type PointCloudAnnotationMappedAssetData } from '../../hooks/types';
 import { EMPTY_ARRAY } from '../../utilities/constants';
 import { isDefined } from '../../utilities/isDefined';
diff --git a/react-components/src/components/CadModelContainer/CadModelContainer.tsx b/react-components/src/components/CadModelContainer/CadModelContainer.tsx
index c192f69c964..d36323f2fd8 100644
--- a/react-components/src/components/CadModelContainer/CadModelContainer.tsx
+++ b/react-components/src/components/CadModelContainer/CadModelContainer.tsx
@@ -6,11 +6,12 @@ import { type AddModelOptions, type CogniteCadModel } from '@cognite/reveal';
 import { useReveal } from '../RevealCanvas/ViewerContext';
 import { Matrix4 } from 'three';
 import { useRevealKeepAlive } from '../RevealKeepAlive/RevealKeepAliveContext';
-import { type CadModelStyling, useApplyCadModelStyling } from './useApplyCadModelStyling';
 import { useReveal3DResourcesCount } from '../Reveal3DResources/Reveal3DResourcesInfoContext';
 import { isEqual } from 'lodash';
 import { modelExists } from '../../utilities/modelExists';
 import { getViewerResourceCount } from '../../utilities/getViewerResourceCount';
+import { type CadModelStyling } from './types';
+import { useApplyCadModelStyling } from './useApplyCadModelStyling';
 
 export type CogniteCadModelProps = {
   addModelOptions: AddModelOptions;
diff --git a/react-components/src/components/CadModelContainer/types.ts b/react-components/src/components/CadModelContainer/types.ts
new file mode 100644
index 00000000000..2bb25278356
--- /dev/null
+++ b/react-components/src/components/CadModelContainer/types.ts
@@ -0,0 +1,33 @@
+/*!
+ * Copyright 2024 Cognite AS
+ */
+import { type IndexSet, type NodeAppearance } from '@cognite/reveal';
+
+export type NodeStylingGroup = {
+  nodeIds: number[];
+  style?: NodeAppearance;
+};
+
+export type TreeIndexStylingGroup = {
+  treeIndexSet: IndexSet;
+  style?: NodeAppearance;
+};
+
+export type CadStylingGroup = NodeStylingGroup | TreeIndexStylingGroup;
+
+export type CadModelStyling = {
+  defaultStyle?: NodeAppearance;
+  groups?: CadStylingGroup[];
+};
+
+export function isNodeStylingGroup(
+  stylingGroup: CadStylingGroup
+): stylingGroup is NodeStylingGroup {
+  return 'nodeIds' in stylingGroup;
+}
+
+export function isTreeIndexStylingGroup(
+  stylingGroup: CadStylingGroup
+): stylingGroup is TreeIndexStylingGroup {
+  return 'treeIndexSet' in stylingGroup;
+}
diff --git a/react-components/src/components/CadModelContainer/useApplyCadModelStyling.tsx b/react-components/src/components/CadModelContainer/useApplyCadModelStyling.tsx
index fb38f01118d..bcb61d3b007 100644
--- a/react-components/src/components/CadModelContainer/useApplyCadModelStyling.tsx
+++ b/react-components/src/components/CadModelContainer/useApplyCadModelStyling.tsx
@@ -7,8 +7,7 @@ import {
   type NodeAppearance,
   type NodeCollection,
   NodeIdNodeCollection,
-  TreeIndexNodeCollection,
-  type IndexSet
+  TreeIndexNodeCollection
 } from '@cognite/reveal';
 import { useEffect } from 'react';
 import { useSDK } from '../RevealCanvas/SDKProvider';
@@ -16,21 +15,14 @@ import { type CogniteClient } from '@cognite/sdk';
 import { isEqual } from 'lodash';
 import { useReveal } from '../RevealCanvas/ViewerContext';
 import { modelExists } from '../../utilities/modelExists';
-
-export type NodeStylingGroup = {
-  nodeIds: number[];
-  style?: NodeAppearance;
-};
-
-export type TreeIndexStylingGroup = {
-  treeIndexSet: IndexSet;
-  style?: NodeAppearance;
-};
-
-export type CadModelStyling = {
-  defaultStyle?: NodeAppearance;
-  groups?: Array<NodeStylingGroup | TreeIndexStylingGroup>;
-};
+import {
+  isNodeStylingGroup,
+  isTreeIndexStylingGroup,
+  type CadModelStyling,
+  type NodeStylingGroup,
+  type TreeIndexStylingGroup
+} from './types';
+import { assertNever } from '../../utilities/assertNever';
 
 export const useApplyCadModelStyling = (
   model?: CogniteCadModel,
@@ -72,15 +64,15 @@ async function applyStyling(
 
     if (stylingGroup.style === undefined) continue;
 
-    if ('treeIndexSet' in stylingGroup) {
+    if (isTreeIndexStylingGroup(stylingGroup)) {
       const nodes = new TreeIndexNodeCollection(stylingGroup.treeIndexSet);
       model.assignStyledNodeCollection(nodes, stylingGroup.style);
-    }
-
-    if ('nodeIds' in stylingGroup) {
+    } else if (isNodeStylingGroup(stylingGroup)) {
       const nodes = new NodeIdNodeCollection(sdk, model);
       await nodes.executeFilter(stylingGroup.nodeIds);
       model.assignStyledNodeCollection(nodes, stylingGroup.style);
+    } else {
+      assertNever(stylingGroup);
     }
   }
 
diff --git a/react-components/src/components/Reveal3DResources/Reveal3DResources.tsx b/react-components/src/components/Reveal3DResources/Reveal3DResources.tsx
index d44470447a1..451d3ae961f 100644
--- a/react-components/src/components/Reveal3DResources/Reveal3DResources.tsx
+++ b/react-components/src/components/Reveal3DResources/Reveal3DResources.tsx
@@ -4,20 +4,17 @@
 import { useRef, type ReactElement, useState, useEffect, useMemo } from 'react';
 import { type Cognite3DViewer } from '@cognite/reveal';
 import { CadModelContainer } from '../CadModelContainer/CadModelContainer';
-import { type CadModelStyling } from '../CadModelContainer/useApplyCadModelStyling';
 import { PointCloudContainer } from '../PointCloudContainer/PointCloudContainer';
 import { Image360CollectionContainer } from '../Image360CollectionContainer/Image360CollectionContainer';
 import { useReveal } from '../RevealCanvas/ViewerContext';
 import {
-  type AddReveal3DModelOptions,
   type TypedReveal3DModel,
   type AddResourceOptions,
   type Reveal3DResourcesProps,
   type CadModelOptions,
   type PointCloudModelOptions
 } from './types';
-import { useCalculateCadStyling } from '../../hooks/useCalculateModelsStyling';
-import { useCalculatePointCloudStyling } from '../../hooks/useCalculatePointCloudModelsStyling';
+import { useCalculatePointCloudStyling } from './useCalculatePointCloudStyling';
 import {
   type AnnotationIdStylingGroup,
   type PointCloudModelStyling
@@ -29,14 +26,16 @@ import {
   isImage360AssetStylingGroup
 } from '../../utilities/StylingGroupUtils';
 import { type ImageCollectionModelStyling } from '../Image360CollectionContainer/useApply360AnnotationStyling';
-import { is360ImageAddOptions } from './typeGuards';
+import { is360ImageAddOptions, is3dResourceOptions } from './typeGuards';
 import { useRemoveNonReferencedModels } from './useRemoveNonReferencedModels';
 import {
   useAssetMappedNodesForRevisions,
   useGenerateAssetMappingCachePerItemFromModelCache,
   useGenerateNode3DCache
 } from '../CacheProvider/AssetMappingAndNode3DCacheProvider';
+import { useCalculateCadStyling } from './useCalculateCadStyling';
 import { useReveal3DResourcesStylingLoadingSetter } from './Reveal3DResourcesInfoContext';
+import { type CadModelStyling } from '../CadModelContainer/types';
 
 export const Reveal3DResources = ({
   resources,
@@ -93,7 +92,6 @@ export const Reveal3DResources = ({
   );
 
   const setModel3DStylingLoading = useReveal3DResourcesStylingLoadingSetter();
-  setModel3DStylingLoading(!(isModelMappingsFetched || !isModelMappingsLoading));
 
   useEffect(() => {
     setModel3DStylingLoading(!(isModelMappingsFetched || !isModelMappingsLoading));
@@ -210,22 +208,16 @@ async function getTypedModels(
 ): Promise<TypedReveal3DModel[]> {
   const errorFunction = onLoadFail ?? defaultLoadFailHandler;
 
-  const modelTypePromises = resources
-    .filter(
-      (resource): resource is AddReveal3DModelOptions =>
-        (resource as AddReveal3DModelOptions).modelId !== undefined &&
-        (resource as AddReveal3DModelOptions).revisionId !== undefined
-    )
-    .map(async (addModelOptions) => {
-      const type = await viewer
-        .determineModelType(addModelOptions.modelId, addModelOptions.revisionId)
-        .catch((error) => {
-          errorFunction(addModelOptions, error);
-          return '';
-        });
-      const typedModel = { ...addModelOptions, type };
-      return typedModel;
-    });
+  const modelTypePromises = resources.filter(is3dResourceOptions).map(async (addModelOptions) => {
+    const type = await viewer
+      .determineModelType(addModelOptions.modelId, addModelOptions.revisionId)
+      .catch((error) => {
+        errorFunction(addModelOptions, error);
+        return '';
+      });
+    const typedModel = { ...addModelOptions, type };
+    return typedModel;
+  });
 
   const resourceLoadResults = await Promise.all(modelTypePromises);
   const successfullyLoadedResources = resourceLoadResults.filter(
diff --git a/react-components/src/components/Reveal3DResources/typeGuards.ts b/react-components/src/components/Reveal3DResources/typeGuards.ts
index 48ee79798e7..fd50189d6b2 100644
--- a/react-components/src/components/Reveal3DResources/typeGuards.ts
+++ b/react-components/src/components/Reveal3DResources/typeGuards.ts
@@ -6,19 +6,19 @@ import {
   type AddImage360CollectionDatamodelsOptions,
   type AddImage360CollectionOptions,
   type AddResourceOptions,
-  type AddReveal3DModelOptions
+  type Add3dResourceOptions
 } from './types';
 
 export function is360ImageAddOptions(
   addOptions: AddResourceOptions
 ): addOptions is AddImage360CollectionOptions {
-  return !is3dModelOptions(addOptions);
+  return !is3dResourceOptions(addOptions);
 }
 
-export function is3dModelOptions(
+export function is3dResourceOptions(
   addOptions: AddResourceOptions
-): addOptions is AddReveal3DModelOptions {
-  const modelOptions = addOptions as AddReveal3DModelOptions;
+): addOptions is Add3dResourceOptions {
+  const modelOptions = addOptions as Add3dResourceOptions;
   return modelOptions.modelId !== undefined && modelOptions.revisionId !== undefined;
 }
 
diff --git a/react-components/src/components/Reveal3DResources/types.ts b/react-components/src/components/Reveal3DResources/types.ts
index b65d0d12db9..5fe66ba3c48 100644
--- a/react-components/src/components/Reveal3DResources/types.ts
+++ b/react-components/src/components/Reveal3DResources/types.ts
@@ -11,6 +11,7 @@ import {
 import { type Matrix4 } from 'three';
 import { type DmsUniqueIdentifier, type Source } from '../../utilities/FdmSDK';
 import { type CogniteInternalId, type Node3D } from '@cognite/sdk';
+import { type TreeIndexStylingGroup } from '../CadModelContainer/types';
 
 export type AddImage360CollectionOptions =
   | AddImage360CollectionEventsOptions
@@ -40,29 +41,45 @@ export type TaggedAddImage360CollectionOptions = {
   type: 'image360';
   addOptions: AddImage360CollectionOptions;
 };
-export type TaggedAdd3DModelOptions = {
-  type: 'cad' | 'pointcloud';
-  addOptions: AddReveal3DModelOptions;
+export type TaggedAddCadResourceOptions = {
+  type: 'cad';
+  addOptions: AddCadResourceOptions;
 };
 
-export type TaggedAddResourceOptions = TaggedAdd3DModelOptions | TaggedAddImage360CollectionOptions;
+export type TaggedAddPointCloudResourceOptions = {
+  type: 'pointcloud';
+  addOptions: AddPointCloudResourceOptions;
+};
+
+export type TaggedAddResourceOptions =
+  | TaggedAddCadResourceOptions
+  | TaggedAddPointCloudResourceOptions
+  | TaggedAddImage360CollectionOptions;
+
+export type AddResourceOptions =
+  | AddCadResourceOptions
+  | AddPointCloudResourceOptions
+  | AddImage360CollectionOptions;
 
-export type AddResourceOptions = AddReveal3DModelOptions | AddImage360CollectionOptions;
+export type Add3dResourceOptions = AddModelOptions & { transform?: Matrix4 };
 
-export type AddReveal3DModelOptions = AddModelOptions & { transform?: Matrix4 } & {
+export type AddPointCloudResourceOptions = Add3dResourceOptions & {
   styling?: { default?: NodeAppearance; mapped?: NodeAppearance };
 };
-export type TypedReveal3DModel = CadModelOptions | PointCloudModelOptions;
 
-export type CadModelOptions = { type: 'cad' } & AddModelOptions & { transform?: Matrix4 } & {
-    styling?: { default?: NodeAppearance; mapped?: NodeAppearance };
+export type AddCadResourceOptions = AddModelOptions & { transform?: Matrix4 } & {
+  styling?: {
+    default?: NodeAppearance;
+    mapped?: NodeAppearance;
+    nodeGroups?: TreeIndexStylingGroup[];
   };
+};
 
-export type PointCloudModelOptions = { type: 'pointcloud' } & AddModelOptions & {
-    transform?: Matrix4;
-  } & {
-    styling?: { default?: NodeAppearance; mapped?: NodeAppearance };
-  };
+export type TypedReveal3DModel = CadModelOptions | PointCloudModelOptions;
+
+export type CadModelOptions = { type: 'cad' } & AddCadResourceOptions;
+
+export type PointCloudModelOptions = { type: 'pointcloud' } & AddPointCloudResourceOptions;
 
 export type NodeDataResult = {
   fdmNode: DmsUniqueIdentifier;
diff --git a/react-components/src/hooks/useCalculateModelsStyling.tsx b/react-components/src/components/Reveal3DResources/useCalculateCadStyling.tsx
similarity index 95%
rename from react-components/src/hooks/useCalculateModelsStyling.tsx
rename to react-components/src/components/Reveal3DResources/useCalculateCadStyling.tsx
index 9d303c2f584..8fa743a5482 100644
--- a/react-components/src/hooks/useCalculateModelsStyling.tsx
+++ b/react-components/src/components/Reveal3DResources/useCalculateCadStyling.tsx
@@ -6,31 +6,35 @@ import {
   type CadModelOptions,
   type DefaultResourceStyling,
   type FdmAssetStylingGroup
-} from '../components/Reveal3DResources/types';
+} from './types';
 import { NumericRange, type NodeAppearance, IndexSet } from '@cognite/reveal';
-import { type ThreeDModelFdmMappings } from './types';
 import { type Node3D, type CogniteExternalId, type AssetMapping3D } from '@cognite/sdk';
 import {
   useFdmAssetMappings,
   useMappedEdgesForRevisions
-} from '../components/CacheProvider/NodeCacheProvider';
+} from '../CacheProvider/NodeCacheProvider';
 import { useMemo } from 'react';
 import {
   type NodeId,
   type FdmEdgeWithNode,
   type AssetId,
   type ModelRevisionAssetNodesResult
-} from '../components/CacheProvider/types';
+} from '../CacheProvider/types';
 import {
+  type CadStylingGroup,
   type NodeStylingGroup,
   type TreeIndexStylingGroup
-} from '../components/CadModelContainer/useApplyCadModelStyling';
+} from '../CadModelContainer/types';
 import {
   useAssetMappedNodesForRevisions,
   useNodesForAssets
-} from '../components/CacheProvider/AssetMappingAndNode3DCacheProvider';
-import { isSameModel } from '../utilities/isSameModel';
-import { isAssetMappingStylingGroup, isFdmAssetStylingGroup } from '../utilities/StylingGroupUtils';
+} from '../CacheProvider/AssetMappingAndNode3DCacheProvider';
+import {
+  isAssetMappingStylingGroup,
+  isFdmAssetStylingGroup
+} from '../../utilities/StylingGroupUtils';
+import { type ThreeDModelFdmMappings } from '../../hooks/types';
+import { isSameModel } from '../../utilities/isSameModel';
 
 type ModelStyleGroup = {
   model: CadModelOptions;
@@ -49,11 +53,9 @@ type StyledModelWithMappingsFetched = {
   isModelMappingsLoading: boolean;
 };
 
-export type CadStyleGroup = NodeStylingGroup | TreeIndexStylingGroup;
-
 export type StyledModel = {
   model: CadModelOptions;
-  styleGroups: CadStyleGroup[];
+  styleGroups: CadStylingGroup[];
 };
 
 export const useCalculateCadStyling = (
@@ -285,6 +287,11 @@ function useJoinStylingGroups(
       const instanceStyleGroups = modelInstanceStyleGroups
         .filter((typedModel) => isSameModel(typedModel.model, model))
         .flatMap((typedModel) => typedModel.styleGroup);
+
+      if (model.styling?.nodeGroups !== undefined) {
+        instanceStyleGroups.push(...model.styling.nodeGroups);
+      }
+
       return {
         model,
         styleGroups: [...mappedStyleGroup, ...instanceStyleGroups]
diff --git a/react-components/src/hooks/useCalculatePointCloudModelsStyling.tsx b/react-components/src/components/Reveal3DResources/useCalculatePointCloudStyling.tsx
similarity index 93%
rename from react-components/src/hooks/useCalculatePointCloudModelsStyling.tsx
rename to react-components/src/components/Reveal3DResources/useCalculatePointCloudStyling.tsx
index 179b63cc2be..26a816f0c0f 100644
--- a/react-components/src/hooks/useCalculatePointCloudModelsStyling.tsx
+++ b/react-components/src/components/Reveal3DResources/useCalculatePointCloudStyling.tsx
@@ -6,17 +6,17 @@ import {
   type DefaultResourceStyling,
   type PointCloudModelOptions,
   type AssetStylingGroup
-} from '../components/Reveal3DResources/types';
+} from './types';
 import { useMemo } from 'react';
-import { type AnnotationIdStylingGroup } from '../components/PointCloudContainer/useApplyPointCloudStyling';
+import { type AnnotationIdStylingGroup } from '../PointCloudContainer/useApplyPointCloudStyling';
 import { useQuery } from '@tanstack/react-query';
-import { isSame3dModel } from '../utilities/isSameModel';
+import { isSame3dModel } from '../../utilities/isSameModel';
 import {
   usePointCloudAnnotationMappingsForModels,
   usePointCloudAnnotationIdsForModels
-} from '../components/CacheProvider/PointCloudAnnotationCacheProvider';
-import { EMPTY_ARRAY } from '../utilities/constants';
-import { type PointCloudAnnotationModel } from '../components/CacheProvider/types';
+} from '../CacheProvider/PointCloudAnnotationCacheProvider';
+import { EMPTY_ARRAY } from '../../utilities/constants';
+import { type PointCloudAnnotationModel } from '../CacheProvider/types';
 
 export type StyledPointCloudModel = {
   model: PointCloudModelOptions;
diff --git a/react-components/src/components/Reveal3DResources/useRemoveNonReferencedModels.ts b/react-components/src/components/Reveal3DResources/useRemoveNonReferencedModels.ts
index 09e5d23b3aa..9d782065003 100644
--- a/react-components/src/components/Reveal3DResources/useRemoveNonReferencedModels.ts
+++ b/react-components/src/components/Reveal3DResources/useRemoveNonReferencedModels.ts
@@ -7,7 +7,7 @@ import {
   is360ImageAddOptions,
   is360ImageDataModelAddOptions,
   is360ImageEventsAddOptions,
-  is3dModelOptions
+  is3dResourceOptions
 } from './typeGuards';
 import { useEffect } from 'react';
 import { isSame3dModel } from '../../utilities/isSameModel';
@@ -36,12 +36,12 @@ function findNonReferencedModels(
   viewer: Cognite3DViewer
 ): CogniteModel[] {
   const models = viewer.models;
-  const addOptionsSet = new Set(addOptions.filter(is3dModelOptions));
+  const addOptionsSet = new Set(addOptions.filter(is3dResourceOptions));
 
   return models.filter((model) => {
     const correspondingAddOptions = (() => {
       for (const options of addOptionsSet) {
-        if (!is3dModelOptions(options)) {
+        if (!is3dResourceOptions(options)) {
           continue;
         }
 
diff --git a/react-components/src/hooks/network/getCadModelsForAsset.ts b/react-components/src/hooks/network/getCadModelsForAsset.ts
index 85bb847be2a..2ec2e5e0b44 100644
--- a/react-components/src/hooks/network/getCadModelsForAsset.ts
+++ b/react-components/src/hooks/network/getCadModelsForAsset.ts
@@ -2,7 +2,7 @@
  * Copyright 2024 Cognite AS
  */
 import { type CogniteClient } from '@cognite/sdk';
-import { type TaggedAdd3DModelOptions } from '../../components/Reveal3DResources/types';
+import { type TaggedAddCadResourceOptions } from '../../components/Reveal3DResources/types';
 
 export type CadModelNode = {
   modelId: number;
@@ -13,7 +13,7 @@ export type CadModelNode = {
 export async function getCadModelsForAsset(
   assetId: number,
   sdk: CogniteClient
-): Promise<TaggedAdd3DModelOptions[]> {
+): Promise<TaggedAddCadResourceOptions[]> {
   const result = await sdk.get<{ items: CadModelNode[] }>(
     `api/v1/projects/${sdk.project}/3d/mappings/${assetId}/modelnodes`,
     {
diff --git a/react-components/src/hooks/network/getCadModelsForFdmInstance.ts b/react-components/src/hooks/network/getCadModelsForFdmInstance.ts
index 5070ed469e1..e67685f7f4d 100644
--- a/react-components/src/hooks/network/getCadModelsForFdmInstance.ts
+++ b/react-components/src/hooks/network/getCadModelsForFdmInstance.ts
@@ -1,13 +1,13 @@
 /*!
  * Copyright 2024 Cognite AS
  */
+import { type TaggedAddCadResourceOptions } from '../../components/Reveal3DResources/types';
 import { type DmsUniqueIdentifier, type EdgeItem, type FdmSDK } from '../../utilities/FdmSDK';
 import {
   type InModel3dEdgeProperties,
   SYSTEM_3D_EDGE_SOURCE
 } from '../../utilities/globalDataModels';
 import { isDefined } from '../../utilities/isDefined';
-import { type TaggedAdd3DModelOptions } from '../../components/Reveal3DResources/types';
 
 type ModelForInstancesResponse = {
   model_edges: Array<EdgeItem<Record<string, Record<string, InModel3dEdgeProperties>>>>;
@@ -16,7 +16,7 @@ type ModelForInstancesResponse = {
 export async function getCadModelsForFdmInstance(
   instance: DmsUniqueIdentifier,
   sdk: FdmSDK
-): Promise<TaggedAdd3DModelOptions[]> {
+): Promise<TaggedAddCadResourceOptions[]> {
   const result = (
     await sdk.queryNodesAndEdges({
       ...modelsForInstanceQuery,
diff --git a/react-components/src/hooks/network/getPointCloudModelsForAsset.ts b/react-components/src/hooks/network/getPointCloudModelsForAsset.ts
index ee226a04f50..4f8919e4ffd 100644
--- a/react-components/src/hooks/network/getPointCloudModelsForAsset.ts
+++ b/react-components/src/hooks/network/getPointCloudModelsForAsset.ts
@@ -2,13 +2,13 @@
  * Copyright 2024 Cognite AS
  */
 import { type Revision3D, type CogniteClient } from '@cognite/sdk/dist/src';
-import { type TaggedAdd3DModelOptions } from '../../components/Reveal3DResources/types';
 import { chunk } from 'lodash';
+import { type TaggedAddPointCloudResourceOptions } from '../../components/Reveal3DResources/types';
 
 export async function getPointCloudModelsForAsset(
   assetId: number,
   sdk: CogniteClient
-): Promise<TaggedAdd3DModelOptions[]> {
+): Promise<TaggedAddPointCloudResourceOptions[]> {
   const modelIdResult = await sdk.annotations
     .reverseLookup({
       filter: { annotatedResourceType: 'threedmodel', data: { assetRef: { id: assetId } } },
diff --git a/react-components/src/hooks/types.ts b/react-components/src/hooks/types.ts
index 189bea53f4e..05154ed08f7 100644
--- a/react-components/src/hooks/types.ts
+++ b/react-components/src/hooks/types.ts
@@ -2,8 +2,8 @@
  * Copyright 2023 Cognite AS
  */
 import { type Node3D, type CogniteExternalId, type Asset } from '@cognite/sdk';
-import { type AssetAnnotationImage360Info } from '@cognite/reveal';
 import { type DmsUniqueIdentifier } from '../utilities/FdmSDK';
+import { type AssetAnnotationImage360Info } from '@cognite/reveal';
 
 export type ThreeDModelFdmMappings = {
   modelId: number;
diff --git a/react-components/src/index.ts b/react-components/src/index.ts
index 1c14f2abb8b..5af7604702d 100644
--- a/react-components/src/index.ts
+++ b/react-components/src/index.ts
@@ -91,9 +91,10 @@ export {
 export { type CogniteCadModelProps } from './components/CadModelContainer/CadModelContainer';
 export {
   type CadModelStyling,
+  type CadStylingGroup,
   type TreeIndexStylingGroup,
   type NodeStylingGroup
-} from './components/CadModelContainer/useApplyCadModelStyling';
+} from './components/CadModelContainer/types';
 export {
   type Reveal3DResourcesProps,
   type FdmAssetStylingGroup,
@@ -101,14 +102,17 @@ export {
   type DefaultResourceStyling,
   type Image360AssetStylingGroup,
   type CommonImage360Settings,
+  type TaggedAddCadResourceOptions,
+  type TaggedAddPointCloudResourceOptions,
   type TaggedAddResourceOptions,
-  type TaggedAdd3DModelOptions,
   type TaggedAddImage360CollectionOptions,
   type AddImage360CollectionEventsOptions,
   type AddImage360CollectionDatamodelsOptions,
   type AddImage360CollectionOptions,
   type AddResourceOptions,
-  type AddReveal3DModelOptions
+  type Add3dResourceOptions,
+  type AddCadResourceOptions,
+  type AddPointCloudResourceOptions
 } from './components/Reveal3DResources/types';
 export {
   type PointCloudAnnotationMappedAssetData,
diff --git a/react-components/src/query/use3dScenes.tsx b/react-components/src/query/use3dScenes.tsx
index 7721cbe4856..2b6a5510d92 100644
--- a/react-components/src/query/use3dScenes.tsx
+++ b/react-components/src/query/use3dScenes.tsx
@@ -17,11 +17,11 @@ import {
 } from '../hooks/types';
 import { Euler, MathUtils, Matrix4 } from 'three';
 import { CDF_TO_VIEWER_TRANSFORMATION } from '@cognite/reveal';
+import { type GroundPlane, type Skybox } from '../components/SceneContainer/sceneTypes';
 import {
-  type AddReveal3DModelOptions,
+  type Add3dResourceOptions,
   type AddImage360CollectionDatamodelsOptions
 } from '../components/Reveal3DResources/types';
-import { type GroundPlane, type Skybox } from '../components/SceneContainer/sceneTypes';
 
 export type Space = string;
 export type ExternalId = string;
@@ -34,7 +34,7 @@ export type SceneData = {
   cameraEulerRotationX: number;
   cameraEulerRotationY: number;
   cameraEulerRotationZ: number;
-  cadModelOptions: AddReveal3DModelOptions[];
+  cadModelOptions: Add3dResourceOptions[];
   image360CollectionOptions: AddImage360CollectionDatamodelsOptions[];
   groundPlanes: GroundPlane[];
   skybox?: Skybox;
diff --git a/react-components/src/utilities/isSameModel.ts b/react-components/src/utilities/isSameModel.ts
index 9b015e502f3..1eebacc1116 100644
--- a/react-components/src/utilities/isSameModel.ts
+++ b/react-components/src/utilities/isSameModel.ts
@@ -3,8 +3,8 @@
  */
 import { type GeometryFilter } from '@cognite/reveal';
 import {
-  type CadModelOptions,
-  type AddReveal3DModelOptions
+  type Add3dResourceOptions,
+  type CadModelOptions
 } from '../components/Reveal3DResources/types';
 import { Matrix4 } from 'three';
 
@@ -43,10 +43,7 @@ function isSameGeometryFilter(
   );
 }
 
-export function isSame3dModel(
-  model0: AddReveal3DModelOptions,
-  model1: AddReveal3DModelOptions
-): boolean {
+export function isSame3dModel(model0: Add3dResourceOptions, model1: Add3dResourceOptions): boolean {
   return (
     model0.modelId === model1.modelId &&
     model0.revisionId === model1.revisionId &&
diff --git a/react-components/stories/Reveal3DResources.stories.tsx b/react-components/stories/Reveal3DResources.stories.tsx
index e77f1999901..7470a6dc956 100644
--- a/react-components/stories/Reveal3DResources.stories.tsx
+++ b/react-components/stories/Reveal3DResources.stories.tsx
@@ -6,6 +6,7 @@ import { Reveal3DResources, RevealCanvas, RevealContext } from '../src';
 import { Color, Matrix4 } from 'three';
 import { createSdkByUrlToken } from './utilities/createSdkByUrlToken';
 import { RevealResourcesFitCameraOnLoad } from './utilities/with3dResoursesFitCameraOnLoad';
+import { IndexSet } from '@cognite/reveal';
 
 const meta = {
   title: 'Example/Reveal3DResources',
@@ -22,13 +23,19 @@ export const Main: Story = {
   args: {
     resources: [
       {
-        modelId: 1791160622840317,
-        revisionId: 498427137020189,
-        transform: new Matrix4().makeTranslation(40, 0, 0)
+        modelId: 3544114490298106,
+        revisionId: 6405404576933316,
+        transform: new Matrix4().makeTranslation(40, 0, 0),
+        styling: {
+          nodeGroups: [
+            { treeIndexSet: new IndexSet([2, 4, 6, 8]), style: { color: new Color('blue') } }
+          ]
+        }
       },
       {
-        modelId: 1791160622840317,
-        revisionId: 498427137020189,
+        modelId: 3544114490298106,
+        revisionId: 6405404576933316,
+        styling: { default: { color: new Color('red') } },
         transform: new Matrix4().makeTranslation(40, 10, 0)
       },
       {
diff --git a/react-components/stories/SearchHooks.stories.tsx b/react-components/stories/SearchHooks.stories.tsx
index 191e9a0252e..6764f1d4b76 100644
--- a/react-components/stories/SearchHooks.stories.tsx
+++ b/react-components/stories/SearchHooks.stories.tsx
@@ -7,9 +7,9 @@ import {
   RevealCanvas,
   RevealToolbar,
   type AddResourceOptions,
-  type AddReveal3DModelOptions,
   type AddImage360CollectionOptions,
-  RevealContext
+  RevealContext,
+  type Add3dResourceOptions
 } from '../src';
 import { Color } from 'three';
 import { type ReactElement, useState, useMemo, useEffect } from 'react';
@@ -60,7 +60,7 @@ const StoryContent = ({ resources }: { resources: AddResourceOptions[] }): React
   >('fdmSearch');
 
   const filteredResources = resources.filter(
-    (resource): resource is AddReveal3DModelOptions => 'modelId' in resource
+    (resource): resource is Add3dResourceOptions => 'modelId' in resource
   );
 
   const { data: searchData } = useSearchMappedEquipmentFDM(
diff --git a/react-components/stories/utilities/is3DModelOptions.ts b/react-components/stories/utilities/is3DModelOptions.ts
index d332a0857da..24726cb8981 100644
--- a/react-components/stories/utilities/is3DModelOptions.ts
+++ b/react-components/stories/utilities/is3DModelOptions.ts
@@ -1,13 +1,13 @@
 /*!
  * Copyright 2023 Cognite AS
  */
-import { type AddResourceOptions, type AddReveal3DModelOptions } from '../../src';
+import { type Add3dResourceOptions, type AddResourceOptions } from '../../src';
 
 export function is3DModelOptions(
   threeDResource: AddResourceOptions
-): threeDResource is AddReveal3DModelOptions {
+): threeDResource is Add3dResourceOptions {
   return (
-    (threeDResource as AddReveal3DModelOptions).modelId !== undefined &&
-    (threeDResource as AddReveal3DModelOptions).revisionId !== undefined
+    (threeDResource as Add3dResourceOptions).modelId !== undefined &&
+    (threeDResource as Add3dResourceOptions).revisionId !== undefined
   );
 }