← Tutti gli articoli

Guide

Migrare da Stylish / Stylus a JustZix — cosa guadagni oltre al CSS

15 maggio 2026 · di JustZix Team

Se usi Stylish o Stylus da anni — JustZix è il loro successore naturale. Tutto ciò che quelli fanno per il CSS, lo fa anche JustZix. In più: regole JS (Stylus non le ha), barre delle azioni con 6 tipi di pulsanti (slider/toggle3/textarea), 4 tipi di finestre nel frontend (CSS pane / JS pane / JS Console / Output Console), snap connections per il layout a dashboard, link di condivisione con TTL e sync tra dispositivi. Niente account, niente tracciamento, completamente open-source. Questo articolo spiega cosa copiare da Stylus e cosa aggiungere da JustZix lungo il percorso.

Perché migrare — riepilogo rapido

Passo 1 — Esportare gli stili da Stylus

Stylus ha un export di backup integrato:

1. Apri l'estensione Stylus → «Manage» → «Backup» → «Export styles to file»
2. Salva stylus_backup.json — è JSON con ogni stile (codice CSS + section con prefissi URL)

Stylish: se l'hai usato, probabilmente hai backup locali o chiavi per userstyles.org. JustZix non ha un import diretto — copia-incolla manuale (ogni stile = una nuova regola JustZix). In media 30 secondi per stile.

Passo 2 — Mappatura dei concetti

Terminologia diversa, semantica simile:

Passo 3 — Incollare il CSS

Per ogni style Stylus:

1. Nelle opzioni JustZix: Folder → +Regola
2. Scope: scegli «Pattern URL» e incolla il prefisso URL di Stylus (es. https://reddit.com/*)
3. Scheda CSS: incolla tutto il codice della section Stylus (senza il wrapper @-moz-document — JustZix lo avvolge automaticamente)
4. Salva

Specifico della sintassi Stylus: se hai usato un preprocessore Less/Stylus/SCSS in Stylus, devi pre-processare in CSS semplice prima di incollare. JustZix è solo CSS semplice (niente babel nel browser).

Passo 4 — Aggiungere le funzioni che Stylus non ha

Dopo la migrazione CSS, puoi arricchire ogni regola con cose impossibili in Stylus:

4a. Regola JS — saltare automaticamente il banner dei cookie

Lacuna classica di Stylus — il JS è un canale laterale non disponibile al CSS. JustZix: aggiungi JS nella stessa regola:

// Regola JS (stesso scope del CSS)
const observer = new MutationObserver(() => {
  const accept = [...document.querySelectorAll('button, a')]
    .find(b => /accept all|akceptuj wszystkie/i.test(b.textContent));
  if (accept) { accept.click(); observer.disconnect(); }
});
observer.observe(document.body, { childList: true, subtree: true });

Il CSS ha nascosto il banner visivamente (difesa), il JS clicca «Accept» quando il banner appare (attacco). Una regola, due strati.

4b. Azione SLIDER — modifica della dimensione del font dal vivo

Userstyle Stylus con var(--font-size) e un prompt di numeri — macchinoso. JustZix:

// Azione SLIDER «🔤 Font»
min: 12, max: 22, step: 1, defaultValue: 16, unit: 'px'

code: |
  document.documentElement.style.setProperty('--user-font', value + 'px');

La regola CSS usa: body, p, span { font-size: var(--user-font, 16px) !important; }. Trascina lo slider nella barra delle azioni → aggiornamento dal vivo senza F5. Memory per dominio.

4c. CSS pane — editor dal vivo per nuovi snippet

Stylus richiede di aprire la pagina delle opzioni + modificare + salvare + ricaricare la pagina. Il CSS pane di JustZix = un pannello accanto alla pagina, scrivere CSS, aggiornamento dal vivo nella scheda stessa. F5 conserva il contenuto del pane (sessionStorage). Perfetto per «provare qualcosa temporaneamente».

Passo 5 — Configurare il sync

Stylus Sync richiede un account Stylus separato + configurazione manuale. JustZix usa chrome.storage.sync automaticamente — se sei loggato su Chrome, le regole sono cifrate e sincronizzate tramite l'account Google.

Limite di chrome.storage.sync: 100 KB totali + 8 KB per item. JustZix divide le regole grandi tra più item. In pratica 50-100 regole CSS+JS entrano senza problemi. Oltre → fallback chrome.storage.local (per dispositivo, senza sync).

Passo 6 — Condividere tramite link TTL (invece di userstyles.org)

userstyles.org = registro centrale, pubblico, persistente. JustZix Share = effimero, opt-in, TTL da 1h a 48h:

1. Regola JustZix → «Share» (icona appunti in alto a destra)
2. Scegli il TTL: 1h / 8h / 24h / 48h
3. Ottieni un link https://www.justzix.com/s/aBcDeF123
4. Incollalo al tuo team in Slack/Discord. Clic → importano la regola da loro
5. Dopo il TTL → il link dà 404, i dati vengono eliminati dal backend (conformità GDPR)

Perfetto per i team QA — «testa questo flusso con il mio setup», «prova questa modifica della UI», «ecco una barra QA da importare». Nessuna persistenza in un registro pubblico.

Caso d'uso 1 — Modalità lettura di Reddit

Un userstyle Stylus «Old Reddit reader mode» → 200 righe di CSS che nascondono la sidebar, gli annunci, le raccomandazioni. JustZix:

• Regola CSS (le stesse 200 righe)
• Più un TOGGLE3 «Mode» (Reader / Default / Compact) — 3 stati con variabili CSS diverse
• Più uno SLIDER «Width» — larghezza della colonna di testo
• Più una Output Console — logga ogni azione «clic su link» (debug per vedere cosa traccia)

Stylus = stile statico. JustZix = strato di personalizzazione interattivo.

Caso d'uso 2 — Modalità scura GitHub (una versione migliore)

Un userstyle Stylus «GitHub Dark» → 500 righe di CSS con colori hardcoded. JustZix:

• Regola CSS con variabili CSS (--bg, --text, --accent)
• TOGGLE3 «Mode» (Light / Dim / Dark / Auto-system) — 4 stati, ognuno imposta le variabili
• SLIDER «Saturation» — desatura i colori per il comfort degli occhi

Personalizzazione direttamente nella scheda, senza tornare alla pagina delle opzioni di Stylus.

Trappole della migrazione

• JustZix NON importa il JSON di Stylus. Copia-incolla manuale per regola. In pratica: 30 sec per stile. Se hai 50 stili → ~25 min. Consiglio di raggruppare il lavoro durante una pausa caffè.
• Niente preprocessing Less/Stylus/SCSS. Il CSS di JustZix è semplice. Pre-processa al build-time prima di incollare, o usa variabili CSS invece di variabili Less.
• La sintassi regex di Stylus differisce da JustZix. Stylus usa regexp("...") dentro @-moz-document, lo scope.url di JustZix accetta regex in stile JS. Piccole differenze di sintassi — testa i pattern dopo la migrazione.
• Il registro centrale userstyles.org non c'è più. userstyles.world è un successore parziale. La condivisione JustZix è effimera, non pubblica — per scelta. Se vuoi un hosting CSS pubblico → usa un GitHub Gist + la condivisione JustZix per link rapidi.
• Incidente di tracciamento storico di Stylish. Nel 2018 Stylish è stato disattivato e si è scoperto che il tracciamento di telemetria era attivo. JustZix è open-source MIT, niente analytics di default, GA4 solo tramite consenso esplicito ai cookie (GDPR).

Cosa fare dopo

Dopo aver migrato da Stylus hai la stessa funzionalità + 5x in più. Tutto opzionale — puoi usare solo regole CSS come in Stylus, o esplorare regole JS, barre delle azioni, pane uno alla volta. Vedi anche:

• Mini-IDE nella scheda — mappa completa degli strumenti JustZix
• CSS pane — editor dal vivo nella scheda (la funzione più «Stylus-like»)
• Modalità scura per qualsiasi sito — uno snippet pronto per la migrazione

Installa JustZix — Stylus può vivere in parallelo (Chrome permette entrambe le estensioni contemporaneamente), quindi puoi provare JustZix senza eliminare Stylus. Dopo una settimana vedrai che ne serve solo una.