أيقونة Traffic Light

streamline-plump-color:traffic-light

أيقونة Traffic Light (streamline-plump-color:traffic-light) أيقونة SVG مجانية من مجموعة Plump color icons من تصميم Streamline. مرسومة على شبكة 48 × 48. تُنشر Plump color icons بموجب ترخيص CC BY 4.0، الذي يسمح باستخدامها في المشاريع الشخصية والتجارية بشرط نسب العمل إلى مؤلفه. انسخها كشيفرة SVG أو JSX أو Vue أو Svelte، أو نزّل ملف SVG.

المجموعة: Plump color icons
المؤلف: Streamline
الترخيص: CC-BY-4.0
الحجم: 48 × 48
الفئة: الخرائط والسفر
الوسوم: trafficlight

تنزيل SVG

شيفرة SVG

<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 48 48"><g fill="none" stroke-width="3"><path fill="#8fbffa" d="M35.683 8.059c-.117-2.455-1.821-4.457-4.265-4.713C29.613 3.156 27.164 3 24 3s-5.613.156-7.418.346c-2.444.256-4.148 2.258-4.265 4.713C12.165 11.273 12 16.483 12 24s.165 12.727.317 15.941c.117 2.455 1.821 4.457 4.265 4.713c1.805.19 4.254.346 7.418.346s5.613-.156 7.418-.346c2.444-.256 4.148-2.258 4.265-4.713C35.835 36.727 36 31.517 36 24s-.165-12.727-.317-15.941"/><path fill="#fff" d="M12.47 7.002L11.87 7c-1.282 0-2.515.029-3.517.063C7.03 7.107 5.988 8.212 6.29 9.5c.295 1.266.763 2.403 1.138 3.195a2.17 2.17 0 0 0 1.88 1.253A52 52 0 0 0 12.11 14c.059-2.45.134-4.42.206-5.941q.027-.546.153-1.057M12.016 20h-.146c-1.282 0-2.515.029-3.517.063c-1.323.044-2.365 1.149-2.063 2.437c.295 1.266.763 2.403 1.138 3.195a2.17 2.17 0 0 0 1.88 1.253c.585.029 1.412.052 2.562.052h.139a486 486 0 0 1 .007-7m.072 13h-.218c-1.282 0-2.515.029-3.517.063c-1.323.044-2.365 1.149-2.063 2.437c.295 1.266.763 2.403 1.138 3.195a2.17 2.17 0 0 0 1.88 1.253c.585.029 1.412.052 2.562.052l.45-.001l-.003-.058a265 265 0 0 1-.229-6.94m23.592 6.998l.45.001c1.15 0 1.977-.023 2.562-.052a2.17 2.17 0 0 0 1.88-1.253c.375-.792.842-1.929 1.138-3.195c.301-1.288-.74-2.393-2.063-2.437A106 106 0 0 0 35.91 33a265 265 0 0 1-.23 7m.31-13h.14c1.15 0 1.977-.023 2.562-.052a2.17 2.17 0 0 0 1.88-1.253c.374-.792.842-1.929 1.138-3.195c.3-1.288-.74-2.393-2.063-2.437A106 106 0 0 0 36.129 20h-.146a478 478 0 0 1 .008 7M35.53 7.002q.125.51.153 1.057c.072 1.521.147 3.49.206 5.94l.24.001c1.15 0 1.978-.023 2.563-.052a2.17 2.17 0 0 0 1.88-1.253c.375-.792.842-1.929 1.138-3.195c.301-1.288-.74-2.393-2.063-2.437a106 106 0 0 0-4.118-.06M20.5 36.5a3.5 3.5 0 1 0 7 0a3.5 3.5 0 0 0-7 0m0-12.5a3.5 3.5 0 1 0 7 0a3.5 3.5 0 0 0-7 0m0-12.5a3.5 3.5 0 1 0 7 0a3.5 3.5 0 0 0-7 0"/><path stroke="#2859c5" stroke-linecap="round" stroke-linejoin="round" d="M35.683 8.059c-.117-2.455-1.821-4.457-4.265-4.713C29.613 3.156 27.164 3 24 3s-5.613.156-7.418.346c-2.444.256-4.148 2.258-4.265 4.713C12.165 11.273 12 16.483 12 24s.165 12.727.317 15.941c.117 2.455 1.821 4.457 4.265 4.713c1.805.19 4.254.346 7.418.346s5.613-.156 7.418-.346c2.444-.256 4.148-2.258 4.265-4.713C35.835 36.727 36 31.517 36 24s-.165-12.727-.317-15.941"/><path stroke="#2859c5" stroke-linecap="round" stroke-linejoin="round" d="M12.088 33h-.218c-1.282 0-2.515.029-3.517.063c-1.323.044-2.365 1.149-2.063 2.437c.295 1.266.763 2.403 1.138 3.195a2.17 2.17 0 0 0 1.88 1.253c.585.029 1.412.052 2.562.052l.45-.001l-.003-.058M12.016 20h-.146c-1.282 0-2.515.029-3.517.063c-1.323.044-2.365 1.149-2.063 2.437c.295 1.266.763 2.403 1.138 3.195a2.17 2.17 0 0 0 1.88 1.253c.585.029 1.412.052 2.562.052h.139m.461-19.998L11.87 7c-1.282 0-2.515.029-3.517.063C7.03 7.107 5.988 8.212 6.29 9.5c.295 1.266.763 2.403 1.138 3.195a2.17 2.17 0 0 0 1.88 1.253A52 52 0 0 0 12.11 14m23.801 19h.218c1.283 0 2.516.029 3.518.063c1.322.044 2.364 1.149 2.063 2.437a16.3 16.3 0 0 1-1.139 3.195a2.17 2.17 0 0 1-1.879 1.253c-.585.029-1.412.052-2.563.052l-.45-.001l.004-.058M35.99 27h.14c1.15 0 1.977-.023 2.562-.052a2.17 2.17 0 0 0 1.88-1.253c.374-.792.842-1.929 1.138-3.195c.3-1.288-.74-2.393-2.063-2.437A106 106 0 0 0 36.129 20h-.146M35.53 7.002l.6-.002c1.282 0 2.515.029 3.517.063c1.323.044 2.364 1.149 2.063 2.437a16.3 16.3 0 0 1-1.139 3.195a2.17 2.17 0 0 1-1.879 1.253A52 52 0 0 1 35.89 14M27 37a3 3 0 1 1-6 0a3 3 0 1 1 6 0m0-13a3 3 0 1 1-6 0a3 3 0 1 1 6 0m0-13a3 3 0 1 1-6 0a3 3 0 1 1 6 0"/></g></svg>

كيفية استخدام أيقونة Traffic Light

React

import { Icon } from "@iconify/react";

<Icon icon="streamline-plump-color:traffic-light" width="24" />

Vue

<script setup>
import { Icon } from "@iconify/vue";
</script>

<template>
  <Icon icon="streamline-plump-color:traffic-light" width="24" />
</template>

Svelte

<script>
  import Icon from "@iconify/svelte";
</script>

<Icon icon="streamline-plump-color:traffic-light" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[streamline-plump-color--traffic-light]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/streamline-plump-color -->
<div class="i-streamline-plump-color:traffic-light"></div>

مكوّن ويب

<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>

<iconify-icon icon="streamline-plump-color:traffic-light"></iconify-icon>

صورة HTML

<img src="https://iconyz.com/api/public/svg/streamline-plump-color/traffic-light.svg" alt="أيقونة Traffic Light" width="24" height="24">

أيقونات ذات صلة في Plump color icons

أيقونة Traffic Light في مجموعات أخرى

الأسئلة الشائعة حول أيقونة Traffic Light

هل أيقونة Traffic Light مجانية للاستخدام التجاري؟

نعم. تُنشر Plump color icons بموجب ترخيص CC BY 4.0، الذي يسمح باستخدامها في المشاريع الشخصية والتجارية بشرط نسب العمل إلى مؤلفه.

كيف أستخدم أيقونة Traffic Light في React؟

ثبّت @iconify/react واعرض <Icon icon="streamline-plump-color:traffic-light" />، أو استخدم «نسخ الشيفرة» في هذه الصفحة للحصول على مكوّن React مستقل.

كيف أضيف أيقونة Traffic Light إلى صفحة ويب؟

اربط ملف SVG في وسم صورة: <img src="https://iconyz.com/api/public/svg/streamline-plump-color/traffic-light.svg" alt="أيقونة Traffic Light">، أو الصق شيفرة SVG مباشرة في الصفحة لتنسيقها باستخدام CSS.

تصفح كل Plump color icons →