[Home](/index.md) › [Icons](/icons.md) › Adobe Photoshop

# Adobe Photoshop

Adobe Photoshop is Adobe's raster image editor for photo retouching, compositing and digital painting, with Firefly-powered Generative Fill on desktop, web and mobile.

## At a glance

- **Page**: https://devicons.io/icons/adobe-photoshop/
- **Website**: https://www.adobe.com/products/photoshop.html
- **License**: https://www.adobe.com/legal/permissions/trademarks.html
- **Also known as**: Photoshop, Adobe Photoshop CC, Photoshop on the web, PSD
- **Tags**: [Adobe](/icons/tag/adobe/), [Design](/icons/tag/design/), [Graphics](/icons/tag/graphics/), [Image Editing](/icons/tag/image-editing/), [Photography](/icons/tag/photography/)
- **Version added**: 1.3.0

## Files

Each file is one variant of this logo. The component name is derived from the file name.

| File | Component | Color SVG | Monochrome SVG | Font class |
| --- | --- | --- | --- | --- |
| `adobe-photoshop` | `AdobePhotoshop` | https://devicons.io/devicons/icons/adobe-photoshop.svg | https://devicons.io/devicons/font/adobe-photoshop.svg | `devicons devicons-adobe-photoshop` |

## Install and use

```bash
npm install @dev.icons/react  # or @dev.icons/vue, @dev.icons/svelte
```

### React

```tsx
import { AdobePhotoshop } from "@dev.icons/react";
// Monochrome (inherits currentColor):
// import { AdobePhotoshop } from "@dev.icons/react/mono";

<AdobePhotoshop size={32} alt="Adobe Photoshop logo" />
```

### Vue

```vue
<script setup>
import { AdobePhotoshop } from "@dev.icons/vue";
</script>

<template>
  <AdobePhotoshop :size="32" alt="Adobe Photoshop logo" />
</template>
```

### Svelte

```svelte
<script>
  import { AdobePhotoshop } from "@dev.icons/svelte";
</script>

<AdobePhotoshop size={32} alt="Adobe Photoshop logo" />
```

### Raw SVG

```html
<img src="https://devicons.io/devicons/icons/adobe-photoshop.svg" alt="Adobe Photoshop logo" width="48" height="48" />
```

### Icon font

```css
@import "devicons/css"; /* npm install devicons */
```

```html
<i class="devicons devicons-adobe-photoshop"></i>
```

## About the Adobe Photoshop logo

The Photoshop icon is a dark navy rounded square (#001E36) with the letters "Ps" in bright blue (#31A8FF). It follows Adobe's app icon system, where each Creative Cloud app gets a two-letter mnemonic on a dark tile in its own colour. The rounded tile dates from Adobe's 2020 icon refresh.

The navy tile blends into very dark backgrounds, but the blue letters stay legible.

## When to use this logo

Use Adobe Photoshop in creative tool comparisons, design workflow diagrams, .psd file-type icons and docs for Photoshop plugins or the Photoshop API. It pairs naturally with Adobe Illustrator, Adobe Firefly, Figma, GIMP and Canva.

## Related icons

- [Adobe Animate](/icons/adobe-animate.md)
- [Adobe Illustrator](/icons/adobe-illustrator.md)
- [Adobe](/icons/adobe.md)
- [Adobe Acrobat](/icons/adobe-acrobat.md)
- [Adobe After Effects](/icons/adobe-after-effects.md)
- [Adobe Firefly](/icons/adobe-firefly.md)
- [Adobe Premiere Pro](/icons/adobe-premiere-pro.md)
- [Affinity Photo](/icons/affinity-photo.md)

## Browse the catalog
- Previous: [Adobe Illustrator](/icons/adobe-illustrator.md)
- Next: [Adobe Premiere Pro](/icons/adobe-premiere-pro.md)
- [All icons](/icons.md)