یک گرادیان زیبا از هر عکسی استخراج کنید — تصویر را بیندازید، حالتی را انتخاب کنید و رنگ‌های غالب به توقف‌های گرادیان کشیدنی تبدیل می‌شوند. CSS آماده چسباندن را فوری کپی کنید.

یک تصویر را اینجا بکشید و رها کنید

یا برای مرور کلیک کنید — می‌توانید از کلیپ‌بورد هم بچسبانید

همه چیز در مرورگر شما اجرا می‌شود — تصویر شما هرگز آپلود نمی‌شود، بدون ثبت‌نام، کاملاً رایگان.

تصویر منبع
در حال خواندن رنگ‌ها…
تصویر منبع
حال‌وهوا
رنگ‌های استخراج‌شده
اینها رنگ‌های غالب استخراج‌شده از تصویر شما هستند. روی نمونه کلیک کنید تا کپی شود، یا توقف‌ها را در زیر بکشید تا گرادیان را تنظیم دقیق کنید.
پیش‌نمایش گرادیان
نوع گرادیان
زاویه
°
توقف‌های رنگ
یک دسته را بکشید تا توقف را جابجا کنید، یا روی نوار کلیک کنید تا یکی اضافه شود. یک توقف را انتخاب کنید تا رنگ آن را ویرایش کنید.
توقف انتخاب‌شده
%
CSS
background: ;

درباره مولد گرادیان از تصویر

تولیدکننده گرادیان از تصویر هر عکسی را به یک گرادیان CSS آماده استفاده تبدیل می‌کند. تصویری را رها، مرور یا جای‌گذاری کنید تا ابزار آن را روی یک کانواس بخواند، رنگ‌های غالبش را استخراج کند و آن‌ها را به‌صورت توقف‌گاه‌های گرادیان بچیند که می‌توانید بکشید، رنگ‌شان را عوض کنید و مرتب‌شان کنید تا آمیزش با حس تصویر اصلی هم‌خوان شود.

یک انتخاب‌گر حال‌وهوا (رنگارنگ، روشن، کدر، عمیق یا تیره) تعیین می‌کند کدام رنگ‌های استخراج‌شده به توقف‌گاه تبدیل شوند، پس یک عکس می‌تواند چندین گرادیان بسیار متفاوت تولید کند. شما نوع گرادیان (خطی، شعاعی یا مخروطی)، زاویه، و خودِ توقف‌گاه‌ها را کنترل می‌کنید: روی نوار کلیک کنید تا یکی اضافه شود، بکشید تا جابه‌جا شود، یا با یک کلیک معکوس یا چرخانده شود.

کل فرآیند در مرورگر شما اجرا می‌شود؛ تصویر شما هرگز به سروری آپلود نمی‌شود. وقتی پیش‌نمایش مناسب به نظر رسید، قاعده کامل CSS، فقط مقدار background، یا رنگ‌های استخراج‌شده به‌تنهایی را کپی کنید؛ ایده‌آل برای بخش‌های هیرو، پس‌زمینه صفحات و بصری‌های برند برگرفته از عکاسی.

نحوه استفاده از مولد گرادیان از تصویر

  1. یک تصویر را بکشید و رها کنید، برای مرور کلیک کنید، یا آن را از کلیپ‌بورد خود جای‌گذاری کنید.
  2. یک حال‌وهوا انتخاب کنید (رنگارنگ، روشن، کدر، عمیق یا تیره) تا مشخص شود کدام رنگ‌های استخراج‌شده به توقف‌گاه تبدیل شوند.
  3. نوع گرادیان (خطی، شعاعی یا مخروطی) را انتخاب کنید و زاویه را تنظیم کنید.
  4. توقف‌گاه‌های رنگی را بکشید تا آمیزش را دقیق کنید؛ در صورت نیاز توقف‌گاه اضافه، حذف، معکوس یا جابه‌جا کنید.
  5. روی «کپی CSS» کلیک کنید تا کد گرادیان آماده جای‌گذاری را بردارید.

سوالات متداول

خیر. تصویر مستقیماً در یک کانواس در مرورگر شما خوانده می‌شود، و استخراج رنگ و محاسبات گرادیان همگی به‌صورت محلی انجام می‌شوند. در هیچ مرحله‌ای چیزی از دستگاه شما خارج نمی‌شود.

بله، کاملاً. چون همه‌چیز سمت کاربر اجرا می‌شود، هیچ اعتبار، حسابی یا محدودیتی نیست؛ از هر تعداد تصویر که می‌خواهید گرادیان استخراج کنید.

این ابزار از یک عکس شروع می‌کند: رنگ‌های غالب تصویر را استخراج می‌کند و گرادیان را از آن‌ها می‌سازد. تولیدکننده گرادیان معمولی از صفر با رنگ‌هایی که خودتان انتخاب می‌کنید شروع می‌شود. هر دو نوعی CSS قابل‌ویرایش و آماده کپی تولید می‌کنند.

حال‌وهواها رنگ‌های استخراج‌شده از تصویر شما را دوباره رتبه‌بندی می‌کنند: رنگارنگ فام‌های زنده و متنوع را ترجیح می‌دهد، روشن تُن‌های روشن اشباع‌شده را برمی‌گزیند، کدر رنگ‌های نرم‌تر و کم‌اشباع را انتخاب می‌کند، و عمیق و تیره رنگ‌های غنی‌تر و تیره‌تر را می‌کشند. تعویض حال‌وهوا بلافاصله توقف‌گاه‌های گرادیان را بازمی‌سازد.

بله. هر توقف‌گاه قابل‌کشیدن است، می‌توانید روی نوار کلیک کنید تا توقف‌گاه اضافه کنید یا موارد انتخاب‌شده را حذف کنید، رنگ هر توقف‌گاه را تغییر دهید، بین خطی، شعاعی و مخروطی جابه‌جا شوید، زاویه را در گام‌های ۴۵ درجه بچرخانید، جهت را معکوس کنید، یا رنگ‌های جدید از تصویر را دوباره بچینید.

اشتراک‌گذاری

جستجوهای پرطرفدار
گرادیان از تصویر استخراج گرادیان از عکس تصویر به گرادیان css سازنده گرادیان عکس ساخت گرادیان از عکس گرادیان css از تصویر
به کمک نیاز دارید؟
با این ابزار مشکلی پیدا کردید؟ به تیم ما اطلاع دهید.
گزارش مشکل

این ابزار رایگان را به وب‌سایت خود اضافه کنید — کد زیر را کپی و جای‌گذاری کنید.