> ## Documentation Index
> Fetch the complete documentation index at: https://developer.box.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Get Basic Thumbnail

export const MultiRelatedLinks = ({sections = []}) => {
  if (!sections || sections.length === 0) {
    return null;
  }
  return <div className="space-y-8">
      {sections.map((section, index) => <RelatedLinks key={index} title={section.title} items={section.items} />)}
    </div>;
};

export const RelatedLinks = ({title, items = []}) => {
  const getBadgeClass = badge => {
    if (!badge) return "badge-default";
    const badgeType = badge.toLowerCase().replace(/\s+/g, "-");
    return `badge-${badge === "ガイド" ? "guide" : badgeType}`;
  };
  if (!items || items.length === 0) {
    return null;
  }
  return <div className="my-8">
      {}
      <h3 className="text-sm font-bold uppercase tracking-wider mb-4">{title}</h3>

      {}
      <div className="flex flex-col gap-3">
        {items.map((item, index) => <a key={index} href={item.href} className="py-2 px-3 rounded related_link hover:bg-[#f2f2f2] dark:hover:bg-[#111827] flex items-center gap-3 group no-underline hover:no-underline border-b-0">
            {}
            <span className={`px-2 py-1 rounded-full text-xs font-semibold uppercase tracking-wide flex-shrink-0 ${getBadgeClass(item.badge)}`}>
              {item.badge}
            </span>

            {}
            <span className="text-base">{item.label}</span>
          </a>)}
      </div>
    </div>;
};

export const Link = ({href, children, className, ...props}) => {
  const localizedHref = href;
  return <a href={localizedHref} className={className} {...props}>
      {children}
    </a>;
};

<RelatedLinks
  title="REQUIRED GUIDES"
  items={[
{ label: translate("List All Representations for File"), href: "/guides/representations/list-all-representations", badge: "GUIDE" },
{ label: translate("Request Desired Representation"), href: "/guides/representations/request-a-representation", badge: "GUIDE" },
{ label: translate("Download File Representation"), href: "/guides/representations/download-a-representation", badge: "GUIDE" }
]}
/>

A thumbnail is a small image, either as `.png` or as `.jpg` that can be used in
an application as a representation of the file, for example as a placeholder for
a link that downloads or previews the file.

<Info>
  The preferred way to get a thumbnail for a file is using the
  <Link href="/guides/representations/thumbnail-representation">representations API</Link>.
</Info>

## Requesting

To request a file thumbnail use the <Link href="/reference/get-files-id-thumbnail-id">`GET
/files/:id/thumbnail.:extension`</Link>
endpoint.

<CodeGroup>
  ```sh cURL theme={null}
  curl -i -X GET "https://api.box.com/2.0/files/12345/thumbnail.png" \
       -H "authorization: Bearer <ACCESS_TOKEN>"
  ```

  ```typescript Node/TypeScript v10 theme={null}
  await client.files.getFileThumbnailById(
    thumbnailFile.id,
    'png' as GetFileThumbnailByIdExtension,
  );
  ```

  ```python Python v10 theme={null}
  client.files.get_file_thumbnail_by_id(
      thumbnail_file.id, GetFileThumbnailByIdExtension.PNG
  )
  ```

  ```cs .NET v10 theme={null}
  await client.Files.GetFileThumbnailByIdAsync(fileId: thumbnailFile.Id, extension: GetFileThumbnailByIdExtension.Png);
  ```

  ```swift Swift v10 theme={null}
  try await client.files.getFileThumbnailById(fileId: thumbnailFile.id, extension_: GetFileThumbnailByIdExtension.png, downloadDestinationUrl: destinationPath)
  ```

  ```java Java v10 theme={null}
  client.getFiles().getFileThumbnailById(thumbnailFile.getId(), GetFileThumbnailByIdExtension.PNG)
  ```

  ```python Python v4 theme={null}
  file_id = '11111'

  thumbnail = client.file(file_id).get_thumbnail_representation('92x92', extension='jpg')
  ```

  ```cs .NET v6 theme={null}
  Stream thumbnailContents = await client.FilesManager.GetThumbnailAsync("11111", maxWidth: 160, maxHeight: 160);
  ```
</CodeGroup>

When a thumbnail was successfully created, this will return the thumbnail
in the body of the response as binary data.

## Asynchronous thumbnail creation

Sometimes the thumbnail can not be created directly. Instead, the API will
return a `HTTP 202` with a `location` response header. The location
is for a temporary image that can be used while the thumbnail is being
generated.

A `retry-after` response header is also provided to present you with
an estimated amount of seconds before retrying this endpoint.

## Supported file sizes

The following formats and sizes of thumbnails are available.

| File Type | Dimensions                                                         |
| --------- | ------------------------------------------------------------------ |
| JPG       | `32x32`, `94x94`, `160x160`, `320x320`, `1024x1024`, `2048x2048`\* |
| PNG       | `1024x1024`\*, `2048x2048`\*                                       |

Some restrictions apply to the sizes marked as `*`.

## File size restrictions

### Original file size

Thumbnails are not scaled up. If the original file size of the file uploaded to
Box is smaller than the representation dimensions, the resulting thumbnail is
capped at the size of the original file.

## Supported file types

At this time the following file types are supported.

| File Type | File Extensions                                                                                                                                                 |
| --------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Documents | `doc`, `docx`, `gdoc`, `gsheet`, `gslide`, `gslides`, `odp`, `ods`, `odt`, `pdf`, `ppt`, `pptx`, `rtf`, `wpd`, `xls`, `xlsm`, `xlsx`, `key`, `pages`, `numbers` |
| Images    | `ai`, `bmp`, `dcm`, `dicm`, `eps`, `gif`, `idml`, `indd`, `indt`, `inx`, `jpeg`, `jpg`, `png`, `ps`, `psd`, `svg`, `svs`, `tif`, `tiff`, `tga`                  |
| Audio     | `aac`, `aifc`, `aiff`, `amr`, `au`, `flac`, `m4a`, `mp3`, `ogg`, `ra`, `wav`, `wma`                                                                             |
| Video     | `3g2`, `3gp`, `avi`, `m2v`, `m2ts`, `m4v`, `mkv`, `mov`, `mp4`, `mpeg`, `mpg`, `mts`, `ogg`, `qt`, `wmv`                                                        |

<RelatedLinks
  title="RELATED APIS"
  items={[
{ label: translate("Get file thumbnail"), href: "/reference/get-files-id-thumbnail-id", badge: "GET" }
]}
/>

<RelatedLinks
  title="RELATED GUIDES"
  items={[
{ label: translate("Get Thumbnail Representation"), href: "/guides/representations/thumbnail-representation", badge: "GUIDE" },
{ label: translate("Supported File Types"), href: "/guides/representations/supported-file-types", badge: "GUIDE" }
]}
/>