Обрізати зображення до кола звучить так, ніби це має бути один крок. Заковика — кути. Коло сидить усередині квадрата, а чотири кути поза ним мають стати чимось. Якщо вони стають білими, ваше коло несе білий прямокутник, що вилазить тієї миті, коли ви кладете його на будь-що небіле. Якщо вони стають прозорими, коло чисто плаває на будь-якому фоні. Ця різниця повністю зводиться до формату файлу.
Чому це має бути PNG
JPEG не може зберігати прозорість. Кожен піксель у JPEG непрозорий, тож «кругле» JPEG — це насправді квадрат із білим (чи якимось кольором), що заповнює кути. Воно виглядає круглим лише на відповідному фоні й розвалюється на темній сторінці чи кольоровій картці.
PNG підтримує альфа-канал — кожен піксель може бути повністю видимим, повністю невидимим чи будь-чим між. Саме це дозволяє кутам поза колом бути справді порожніми. Тож кругле обрізання з прозорим фоном — це завжди PNG. Якщо інструмент віддає вам JPEG і називає його прозорим, воно таким бути не може; формат цього не дозволяє.
Як зробити таке
Киньте зображення, оберіть форму кола й експортуйте з прозорим фоном. Під капотом воно бере найбільший квадрат із центру вашого зображення, потім маскує на нього коло в повній роздільній, тож експортований край лишається різким, а не масштабованим із малого перегляду. Кути виходять прозорими, і PNG готовий лягти на будь-який фон.
Ви не обмежені повним колом. Заокруглений квадрат із регульованим радіусом покриває іконки застосунків і мініатюри карток, що хочуть м'яких кутів, а звичайний квадрат дає чисте центроване обрізання без маски. Усі три експортуються однаково, з прозорістю в тій ділянці, що випадає поза формою.
Деталь про якість краю
Одне, що варто знати: маска застосовується в повній роздільній зображення, а не до зменшеного перегляду. Це тримає круглий край чітким, а не зубчастим чи м'яким. Якщо ви колись обрізали коло десь і помічали сходинчастий обідок, це зазвичай результат маскування малого перегляду й масштабування його вгору. Роблення цього в повному розмірі цього уникає.
Чесні обмеження
Обрізання центроване — воно бере середній квадрат вашого зображення, і немає маркера, щоб перемістити кадр. Це ідеально, коли ваш об'єкт уже по центру, і незручно, коли ні. Якщо потрібна частина збоку, спершу обріжте зображення до неї базовим кропером, потім зробіть кругле обрізання результату. Воно також обробляє одне зображення за раз, тож збудоване для одного чистого зрізу, а не пакета з п'ятдесяти.
Воно лишається на вашому пристрої
Усе працює у вашому браузері. Ваше зображення декодується, робиться квадратним, маскується й кодується в PNG локально — нічого не завантажується, немає облікового запису, і жоден сервер ніколи не отримує файл. Завантажте сторінку раз — і воно працює офлайн. Оберіть зображення, обріжте його до кола, експортуйте прозорий PNG — і воно чисто сидітиме, куди б ви його не поклали.