Finding type definitions for schema types in a Slack thread.

The type definitions for Sanity schema types, including image objects, are available in the @sanity/types package. This is the official TypeScript types package that contains all the core type definitions you'll need.

For your specific image object example, you're looking for the SanityImageObject type (also sometimes called ImageValue). Here's how to use it:

Installation

npm install @sanity/types

Using Image Types

import type { SanityImageObject } from '@sanity/types'

// Your image object will match this type
const myImage: SanityImageObject = {
  _type: 'image',
  asset: {
    _ref: 'image-xyz-jpg',
    _type: 'reference'
  }
}

// Use it in component props
function MyImageComponent({ image }: { image: SanityImageObject }) {
  // ...
}

Common Image-Related Types

The @sanity/types package includes several useful types for working with images:

• SanityImageObject - The full image object with asset reference, crop, and hotspot
• SanityImageAssetDocument - The actual image asset document
• SanityReference - Generic reference type (what asset uses)
• SanityAsset - Base asset type

Working with @sanity/image-url

If you're using @sanity/image-url to build image URLs, it also exports helpful types:

import { createImageUrlBuilder, type SanityImageSource } from '@sanity/image-url'
import type { SanityImageObject } from '@sanity/types'

// SanityImageSource accepts multiple formats
function urlFor(source: SanityImageSource) {
  return builder.image(source)
}

Full Image Object Type

When your image includes crop and hotspot data (which editors can set in Studio), the full type looks like this:

import type { SanityImageObject, SanityImageCrop, SanityImageHotspot } from '@sanity/types'

const imageWithCropAndHotspot: SanityImageObject = {
  _type: 'image',
  asset: {
    _ref: 'image-xyz-jpg',
    _type: 'reference'
  },
  crop?: SanityImageCrop,
  hotspot?: SanityImageHotspot
}

Using Sanity TypeGen

For even better type safety, you can use Sanity TypeGen to automatically generate types from your actual schema. This gives you types that match your specific schema configuration, including custom fields you may have added to your image objects:

npx sanity@latest typegen generate

This will create types based on your schema that you can import directly into your application, giving you full autocomplete and type checking for your specific content structure.