Custom Cursor Trails

Редагувати трейл: Blue star Custom Cursor Trail

Налаштуйте вигляд, параметри та поведінку вашого власного трейлу.

Крок 1: Назва сліду

Введіть назву вашого набору слідів курсора.

Крок 2: Зображення

Додайте зображення будь-яким зручним способом.

АБО

Обрані зображення:

Blue star Custom Cursor Trail
Blue star Custom Cursor Trail

Крок 3: Налаштування

Оберіть тип анімації, розмір та інші параметри.

Loading animation…
Loading…

Як користуватися: створення та налаштування custom cursor trail

Покрокова інструкція зі створення, редагування та використання custom cursor і custom cursor trails у вашому застосунку або розширенні.

  1. Крок 1. Назва custom cursor trail

    У полі "Назва" введіть зрозуміле ім’я майбутнього custom cursor trail (наприклад, Cosmic Sparkles), щоб легше знаходити в розширенні та керувати курсорними ефектами. Це допоможе організувати кілька різних custom cursor trails.

  2. Крок 2. Зображення для custom cursor

    Додайте зображення для custom cursor trail трьома способами: 1) вставте URL, 2) завантажте файл із комп’ютера, 3) оберіть іконки зі своєї бібліотеки зображень. Підтримуються формати JPG, JPEG, PNG, WEBP, BMP, SVG; для найкращого вигляду радимо прозорі PNG або SVG. Оптимальні параметри: 64–128 px і вага до ~200–300 KB - так custom cursor trails працюватимуть плавно без просідань FPS. Якщо зображення за URL не підтягується через CORS, використайте завантаження файлу або вибір із бібліотеки. Ви можете комбінувати кілька іконок в один набір custom cursor trail і видаляти зайві елементи у будь-який момент.

  3. Крок 3. Налаштування custom cursor trails

    Оберіть тип анімації, плавність (easing), розмір зображення (px) і тривалість ефекту (ms). Так ви зможете налаштувати вигляд і поведінку custom cursor trails відповідно до стилю вашого сайту чи розширення.

  4. Додавання custom cursor у розширення та використання

    Переконайтеся, що custom cursor trail відображається коректно, і натисніть "Додати слід у розширення" або "Зберегти зміни". Після збереження оберіть потрібний custom cursor trail у вашому застосунку, щоб активувати ефект на будь-якому сайті.

FAQ: слід курсора, анімація курсора та бібліотека зображень

Найпоширеніші запитання про створення і налаштування курсорних ефектів, роботу з власною базою зображень та оптимізацію анімації.

Які формати та розміри зображень підтримуються для курсорних ефектів?

Підтримуються JPG, JPEG, PNG, WEBP, BMP, SVG. Рекомендуємо невеликі файли (до ~200–300 KB) та розміри іконок 64–128 px.

Як додати зображення зі своєї бази/бібліотеки?

Виберіть пункт «Обрати з бібліотеки», щоб додати іконки зі своєї бази зображень.

  • Комбінуйте картинки з бібліотеки та локальні файли під єдиний стиль.
  • Оновлюйте набір: видаляйте зайві й додавайте нові елементи.
  • Власна база зображень допомагає зберігати впізнаваність бренду.
Чому інколи не працює додавання за посиланням (URL)?

Деякі сайти блокують завантаження зображень сторонніми застосунками через CORS.

Це не помилка застосунку, а політика безпеки на стороні хостингу.

Чим відрізняються налаштування «Розмір» і «Тривалість» у сліді курсора?
  • Розмір - фізичний розмір зображень (px): впливає на видимість ефекту.
  • Тривалість - час одного циклу (ms): визначає швидкість прояву й зникнення.
Чи можна редагувати існуючий слід курсора?

Так. У режимі редагування змініть тип анімації, easing, розмір або склад зображень і натисніть «Зберегти зміни».

Де використовується створений слід курсора і як його активувати?

Після збереження набір з’являється у вашому розширенні чи застосунку. Оберіть його як активний.

За потреби швидко перемикайтеся між різними ефектами для A/B-тестів.

Як видалити або вимкнути слід курсора?

У налаштуваннях застосунку оберіть стандартний курсор без ефектів або видаліть набір.

Це дозволяє швидко перемикатися між різними варіантами курсора.

Чи можна використовувати власні фотографії як слід курсора?

Так, можна завантажити фото у форматах JPG або PNG і застосовувати як елементи для анімації курсора.

Рекомендуємо обрізати фото, зменшити роздільність і залишити прозорий фон.

Preview Mode