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

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

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


درباره مولد گرادیان

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

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

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

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

  1. یک نوع گرادیان انتخاب کنید: خطی، شعاعی یا مخروطی.
  2. از یک پیش‌تنظیم شروع کنید یا برای نقطه شروع فوری روی «تصادفی» کلیک کنید.
  3. دستگیره‌های توقف‌گاه را بکشید تا رنگ‌ها را جای‌گذاری کنید، روی نوار کلیک کنید تا توقف‌گاه اضافه شود، و رنگ هر توقف‌گاه را ویرایش کنید.
  4. زاویه را تنظیم کنید، یا از «معکوس» و «چرخش ۴۵ درجه» برای تغییر جهت آمیزش استفاده کنید.
  5. قاعده CSS یا مقدار background را کپی کنید و در پروژه خود جای‌گذاری کنید.

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

بله. ابزار کاملاً سمت کاربر است؛ بدون ثبت‌نام، بدون اعتبار و بدون محدودیت روی تعداد گرادیان‌هایی که می‌سازید یا کپی می‌کنید.

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

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

گرادیان‌های خطی و شعاعی همه‌جا پشتیبانی می‌شوند. گرادیان‌های مخروطی در همه مرورگرهای مدرن پشتیبانی می‌شوند اما نه در مرورگرهای بسیار قدیمی، پس اگر باید از نسخه‌های قدیمی پشتیبانی کنید، یک background-color جایگزین ارائه دهید.

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

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

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

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