css3 logo

css3-wordmark from Devicon by konpa · Wordmark · MIT Free for personal and commercial use.

Name: css3-wordmark
Set: Devicon
Style: Wordmark
Viewbox: 128×128
License: MIT

1 other variant in Devicon

The same logo in other sets

css3Boxicons Brands css3Catppuccin Icons css3Font Awesome 6 Brands css3Iconoir css3Line Awesome css3-fillRemix Icon css3Simple Icons css3-outlineTeenyicons css3Unicons Monochrome

Use the css3 logo

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 128 128"><path fill="#131313" d="M89.234 5.856H81.85l7.679 8.333v3.967H73.713v-4.645h7.678l-7.678-8.333V1.207h15.521zm-18.657 0h-7.384l7.679 8.333v3.967H55.055v-4.645h7.679l-7.679-8.333V1.207h15.522zm-18.474.19h-7.968v7.271h7.968v4.839H38.471V1.207h13.632z"/><path fill="#1572b6" d="m27.613 116.706l-8.097-90.813h88.967l-8.104 90.798l-36.434 10.102z"/><path fill="#33a9dc" d="m64.001 119.072l29.439-8.162l6.926-77.591H64.001z"/><path fill="#fff" d="M64 66.22h14.738l1.019-11.405H64V43.677h27.929l-.267 2.988l-2.737 30.692H64z"/><path fill="#ebebeb" d="m64.067 95.146l-.049.014l-12.404-3.35l-.794-8.883H39.641l1.561 17.488l22.814 6.333l.052-.015V95.146z"/><path fill="#fff" d="M77.792 76.886L76.45 91.802l-12.422 3.353v11.588l22.833-6.328l.168-1.882l1.938-21.647z"/><path fill="#ebebeb" d="M64.039 43.677v11.137H37.136l-.224-2.503l-.507-5.646l-.267-2.988zM64 66.221v11.138H51.753l-.223-2.503l-.508-5.647l-.267-2.988z"/></svg>

React

import type { SVGProps } from "react";

export function DeviconCss3Wordmark(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 128 128"><path fill="#131313" d="M89.234 5.856H81.85l7.679 8.333v3.967H73.713v-4.645h7.678l-7.678-8.333V1.207h15.521zm-18.657 0h-7.384l7.679 8.333v3.967H55.055v-4.645h7.679l-7.679-8.333V1.207h15.522zm-18.474.19h-7.968v7.271h7.968v4.839H38.471V1.207h13.632z"/><path fill="#1572b6" d="m27.613 116.706l-8.097-90.813h88.967l-8.104 90.798l-36.434 10.102z"/><path fill="#33a9dc" d="m64.001 119.072l29.439-8.162l6.926-77.591H64.001z"/><path fill="#fff" d="M64 66.22h14.738l1.019-11.405H64V43.677h27.929l-.267 2.988l-2.737 30.692H64z"/><path fill="#ebebeb" d="m64.067 95.146l-.049.014l-12.404-3.35l-.794-8.883H39.641l1.561 17.488l22.814 6.333l.052-.015V95.146z"/><path fill="#fff" d="M77.792 76.886L76.45 91.802l-12.422 3.353v11.588l22.833-6.328l.168-1.882l1.938-21.647z"/><path fill="#ebebeb" d="M64.039 43.677v11.137H37.136l-.224-2.503l-.507-5.646l-.267-2.988zM64 66.221v11.138H51.753l-.223-2.503l-.508-5.647l-.267-2.988z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 128 128"><path fill="#131313" d="M89.234 5.856H81.85l7.679 8.333v3.967H73.713v-4.645h7.678l-7.678-8.333V1.207h15.521zm-18.657 0h-7.384l7.679 8.333v3.967H55.055v-4.645h7.679l-7.679-8.333V1.207h15.522zm-18.474.19h-7.968v7.271h7.968v4.839H38.471V1.207h13.632z"/><path fill="#1572b6" d="m27.613 116.706l-8.097-90.813h88.967l-8.104 90.798l-36.434 10.102z"/><path fill="#33a9dc" d="m64.001 119.072l29.439-8.162l6.926-77.591H64.001z"/><path fill="#fff" d="M64 66.22h14.738l1.019-11.405H64V43.677h27.929l-.267 2.988l-2.737 30.692H64z"/><path fill="#ebebeb" d="m64.067 95.146l-.049.014l-12.404-3.35l-.794-8.883H39.641l1.561 17.488l22.814 6.333l.052-.015V95.146z"/><path fill="#fff" d="M77.792 76.886L76.45 91.802l-12.422 3.353v11.588l22.833-6.328l.168-1.882l1.938-21.647z"/><path fill="#ebebeb" d="M64.039 43.677v11.137H37.136l-.224-2.503l-.507-5.646l-.267-2.988zM64 66.221v11.138H51.753l-.223-2.503l-.508-5.647l-.267-2.988z"/></svg>
</template>

CSS

.icon-css3-wordmark {
  width: 24px;
  height: 24px;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%20128%20128%22%3E%3Cpath%20fill%3D%22%23131313%22%20d%3D%22M89.234%205.856H81.85l7.679%208.333v3.967H73.713v-4.645h7.678l-7.678-8.333V1.207h15.521zm-18.657%200h-7.384l7.679%208.333v3.967H55.055v-4.645h7.679l-7.679-8.333V1.207h15.522zm-18.474.19h-7.968v7.271h7.968v4.839H38.471V1.207h13.632z%22%2F%3E%3Cpath%20fill%3D%22%231572b6%22%20d%3D%22m27.613%20116.706l-8.097-90.813h88.967l-8.104%2090.798l-36.434%2010.102z%22%2F%3E%3Cpath%20fill%3D%22%2333a9dc%22%20d%3D%22m64.001%20119.072l29.439-8.162l6.926-77.591H64.001z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M64%2066.22h14.738l1.019-11.405H64V43.677h27.929l-.267%202.988l-2.737%2030.692H64z%22%2F%3E%3Cpath%20fill%3D%22%23ebebeb%22%20d%3D%22m64.067%2095.146l-.049.014l-12.404-3.35l-.794-8.883H39.641l1.561%2017.488l22.814%206.333l.052-.015V95.146z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M77.792%2076.886L76.45%2091.802l-12.422%203.353v11.588l22.833-6.328l.168-1.882l1.938-21.647z%22%2F%3E%3Cpath%20fill%3D%22%23ebebeb%22%20d%3D%22M64.039%2043.677v11.137H37.136l-.224-2.503l-.507-5.646l-.267-2.988zM64%2066.221v11.138H51.753l-.223-2.503l-.508-5.647l-.267-2.988z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%20128%20128%22%3E%3Cpath%20fill%3D%22%23131313%22%20d%3D%22M89.234%205.856H81.85l7.679%208.333v3.967H73.713v-4.645h7.678l-7.678-8.333V1.207h15.521zm-18.657%200h-7.384l7.679%208.333v3.967H55.055v-4.645h7.679l-7.679-8.333V1.207h15.522zm-18.474.19h-7.968v7.271h7.968v4.839H38.471V1.207h13.632z%22%2F%3E%3Cpath%20fill%3D%22%231572b6%22%20d%3D%22m27.613%20116.706l-8.097-90.813h88.967l-8.104%2090.798l-36.434%2010.102z%22%2F%3E%3Cpath%20fill%3D%22%2333a9dc%22%20d%3D%22m64.001%20119.072l29.439-8.162l6.926-77.591H64.001z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M64%2066.22h14.738l1.019-11.405H64V43.677h27.929l-.267%202.988l-2.737%2030.692H64z%22%2F%3E%3Cpath%20fill%3D%22%23ebebeb%22%20d%3D%22m64.067%2095.146l-.049.014l-12.404-3.35l-.794-8.883H39.641l1.561%2017.488l22.814%206.333l.052-.015V95.146z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M77.792%2076.886L76.45%2091.802l-12.422%203.353v11.588l22.833-6.328l.168-1.882l1.938-21.647z%22%2F%3E%3Cpath%20fill%3D%22%23ebebeb%22%20d%3D%22M64.039%2043.677v11.137H37.136l-.224-2.503l-.507-5.646l-.267-2.988zM64%2066.221v11.138H51.753l-.223-2.503l-.508-5.647l-.267-2.988z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/devicon/css3-wordmark.svg?color=%231a73e8&size=48