Playwright icon
thesvg-color:playwright
The Playwright icon (thesvg-color:playwright) is a free SVG icon from the theSVG Color set by thesvg.org. It is drawn on a 400 × 400 grid. theSVG Color icons are released under the MIT license, which allows use in personal and commercial projects. Copy it as SVG, JSX, Vue or Svelte code, or download the SVG file.
- Icon set
- theSVG Color
- Author
- thesvg.org
- License
- MIT
- Size
- 400 × 400
SVG code
<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewBox="0 0 400 400"><g fill="none"><path fill="#2d4552" d="M136.444 221.556c-12.886 3.657-21.34 10.069-26.909 16.476c5.334-4.668 12.479-8.952 22.117-11.684c9.858-2.794 18.268-2.774 25.217-1.433v-5.434c-5.928-.542-12.724-.11-20.425 2.075m-27.498-45.68L61.09 188.484s.872 1.232 2.487 2.876l40.576-10.692s-.575 7.409-5.568 14.037c9.445-7.146 10.361-18.829 10.361-18.829m40.059 112.471C81.658 306.486 46.027 228.438 35.24 187.928c-4.984-18.699-7.16-32.861-7.74-42a15.5 15.5 0 0 1 .034-2.482c-3.494.211-5.167 2.027-4.826 7.275c.58 9.134 2.755 23.295 7.74 42c10.782 40.504 46.418 118.552 113.765 100.413c14.659-3.949 25.672-11.142 33.939-20.324c-7.62 6.882-17.157 12.302-29.147 15.537m12.656-160.237v4.793h26.416c-.542-1.697-1.088-3.226-1.63-4.793z"/><path fill="#2d4552" d="M193.981 167.584c11.88 3.374 18.163 11.703 21.484 19.074l13.246 3.762s-1.807-25.797-25.141-32.425c-21.829-6.202-35.262 12.129-36.896 14.501c6.35-4.524 15.623-8.228 27.307-4.912m105.441 19.193c-21.849-6.23-35.277 12.139-36.887 14.478c6.355-4.519 15.623-8.224 27.302-4.893c11.861 3.379 18.139 11.698 21.47 19.074l13.265 3.776s-1.836-25.802-25.15-32.435m-13.16 68.018l-110.19-30.805s1.193 6.048 5.77 13.879l92.775 25.936c7.638-4.419 11.645-9.01 11.645-9.01m-76.395 66.307c-87.249-23.392-76.701-134.559-62.583-187.237c5.813-21.709 11.789-37.845 16.745-48.661c-2.957-.609-5.406.949-7.826 5.87c-5.262 10.673-11.991 28.05-18.503 52.376c-14.114 52.677-24.662 163.84 62.583 187.232c41.123 11.017 73.159-5.727 97.04-32.023c-22.668 20.531-51.609 32.042-87.456 22.443"/><path fill="#e2574c" d="M161.661 262.296v-22.433l-62.329 17.674s4.606-26.76 37.112-35.981c9.858-2.794 18.269-2.775 25.217-1.433V128.11h31.208c-3.398-10.5-6.685-18.584-9.446-24.201c-4.567-9.297-9.249-3.134-19.878 5.756c-7.486 6.254-26.406 19.596-54.877 27.268c-28.471 7.677-51.489 5.641-61.093 3.978c-13.615-2.349-20.736-5.339-20.07 5.017c.58 9.134 2.756 23.296 7.74 42c10.782 40.505 46.418 118.553 113.765 100.414c17.592-4.74 30.009-14.109 38.616-26.051h-25.965zM61.085 188.484l47.861-12.608s-1.395 18.412-19.337 23.142c-17.948 4.725-28.524-10.534-28.524-10.534"/><path fill="#2ead33" d="M341.786 129.174c-12.441 2.181-42.288 4.898-79.174-4.989c-36.896-9.881-61.376-27.163-71.075-35.286c-13.749-11.516-19.797-19.519-25.749-7.413c-5.262 10.677-11.991 28.054-18.504 52.38c-14.113 52.677-24.661 163.84 62.583 187.232c87.226 23.372 133.663-78.178 147.777-130.86c6.513-24.321 9.369-42.738 10.155-54.613c.896-13.452-8.344-9.547-26.013-6.451m-175.289 43.582s13.749-21.384 37.068-14.756c23.334 6.628 25.141 32.425 25.141 32.425zm56.923 95.957c-41.017-12.015-47.343-44.723-47.343-44.723l110.185 30.806c0-.005-22.241 25.782-62.842 13.917m38.957-67.218s13.73-21.369 37.045-14.722c23.314 6.638 25.15 32.435 25.15 32.435z"/><path fill="#d65348" d="m139.88 246.04l-40.548 11.492s4.405-25.092 34.275-35.036l-22.96-86.166l-1.984.603c-28.471 7.678-51.489 5.641-61.093 3.978c-13.615-2.348-20.736-5.339-20.07 5.018c.58 9.134 2.756 23.295 7.74 42c10.782 40.504 46.418 118.552 113.765 100.413l1.984-.623zm-78.795-57.555l47.861-12.609s-1.395 18.412-19.337 23.142c-17.947 4.725-28.524-10.533-28.524-10.533"/><path fill="#1d8d22" d="m225.27 269.163l-1.855-.451c-41.017-12.014-47.343-44.722-47.343-44.722l56.818 15.882l30.081-115.591l-.364-.096c-36.896-9.881-61.375-27.163-71.075-35.286c-13.749-11.516-19.797-19.519-25.749-7.413c-5.257 10.677-11.986 28.054-18.499 52.38c-14.113 52.677-24.661 163.84 62.583 187.231l1.788.403zm-58.773-96.407s13.749-21.384 37.068-14.756c23.334 6.628 25.141 32.425 25.141 32.425z"/><path fill="#c04b41" d="m141.946 245.451l-10.874 3.086c2.569 14.482 7.097 28.38 14.204 40.658c1.237-.273 2.464-.508 3.724-.853c3.302-.891 6.364-1.994 9.312-3.197c-7.941-11.784-13.194-25.356-16.366-39.694m-4.246-102c-5.588 20.856-10.587 50.875-9.211 80.985c2.463-1.069 5.065-2.065 7.955-2.885l2.013-.45c-2.454-32.162 2.851-64.936 8.827-87.235a436 436 0 0 1 4.548-15.781a141 141 0 0 1-8.056 4.782a413 413 0 0 0-6.076 20.584"/></g></svg>How to use the Playwright icon
React
import { Icon } from "@iconify/react";
<Icon icon="thesvg-color:playwright" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="thesvg-color:playwright" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="thesvg-color:playwright" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[thesvg-color--playwright]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/thesvg-color -->
<div class="i-thesvg-color:playwright"></div>Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="thesvg-color:playwright"></iconify-icon>HTML image
<img src="https://iconyz.com/api/public/svg/thesvg-color/playwright.svg" alt="Playwright icon" width="24" height="24">Playwright icon in other icon sets
Playwright icon FAQ
Is the Playwright icon free for commercial use?
Yes. theSVG Color icons are released under the MIT license, which allows use in personal and commercial projects.
How do I use the Playwright icon in React?
Install @iconify/react and render <Icon icon="thesvg-color:playwright" />, or use “Copy code” on this page to get a standalone React component.
How do I add the Playwright icon to a web page?
Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/thesvg-color/playwright.svg" alt="Playwright icon">, or paste the SVG code inline to style it with CSS.