MARKETPLACE
PLUGINS
NEBULA - CUSTOM MASK INPUT
Nebula - Custom Mask Input logo

Nebula - Custom Mask Input

Published March 2025
   •    Updated October 2025

Plugin details

EN: Perfect for handling phone numbers, dates, currency, vehicle plates, RGs, CPFs, and other structured inputs. BR: Ideal para números de telefone, datas, moedas, placas de veículos, RGs, CPFs e outros tipos de entrada estruturada.



Nebula - Custom Mask Input


ENGLISH

The Nebula - Custom Mask Input plugin allows you to apply customized input masks to text fields, ensuring consistent data formatting and improved user experience. Perfect for handling phone numbers, dates, currency, vehicle plates, RGs, CPFs, and other structured inputs.

Key Features:  
Flexible Masking – Create custom input masks for numbers, dates, phone numbers, vehicle plates, Doc IDS, and more.  
Dynamic Mask Switching – Change the mask dynamically based on conditions or user input.  
Auto-formatting – Automatically formats user input in real-time.  
Placeholder Support – Define custom placeholders to guide user input.  
Works with Repeating Groups – Fully compatible with dynamic elements in Bubble.  
Optimized for Performance – Ensures smooth and fast input handling.  

Ideal for improving form usability, enforcing data consistency, and enhancing user experience in any Bubble application. 🚀


PORTUGUÊS

O Nebula - Custom Mask Input permite aplicar máscaras personalizadas aos campos de entrada, garantindo formatação consistente e melhorando a experiência do usuário. Ideal para números de telefone, datas, moedas, placas de veículos, RGs, CPFs e outros tipos de entrada estruturada.

Principais Recursos:  
Mascaramento Flexível – Crie máscaras personalizadas para números, datas, telefones, placas de veículos, RGs, CPFs e muito mais.  
Troca Dinâmica de Máscara – Alterne máscaras dinamicamente com base em condições ou entrada do usuário.  
Autoformatação – Formata automaticamente os dados digitados em tempo real.  
Suporte a Placeholder – Defina placeholders personalizados para orientar o usuário.  
Compatível com Repeating Groups – Funciona perfeitamente com elementos dinâmicos no Bubble.  
Otimizado para Performance – Garante um processamento rápido e eficiente.  

Perfeito para melhorar a usabilidade de formulários, padronizar a entrada de dados e aprimorar a experiência do usuário em qualquer aplicativo Bubble. 🚀  


Try it out! | Experimente!

$5

Per month

5.0 stars   •   2 ratings
7 installs  
This plugin does not collect or track your personal data.

Platform

Web

Contributor details

Nebula logo
Nebula
Joined 2023   •   24 Plugins
View contributor profile

Instructions

📖 Instructions | Instruções
EN:   1️⃣ Setup   - Install the plugin and add the **"Nebula - Custom Mask Input"** element to your page.   - Set the **"Input ID"** field to target the specific input element where the mask should be applied.   - Define the **"Mask Type"** field with the desired formatting pattern.   2️⃣ Customization   - **Mask Formatting Rules:**    - Use **"#"** for numbers (e.g., `"###-###"` for a numeric code).    - Use **"A"** for letters (e.g., `"AAA-####"` for a license plate).    - Combine both to create custom formats (e.g., `"AA-###.###"` for IDs).   - **Dynamic Mask Switching:**    - Update the mask dynamically using workflows and conditions.    - Change the format based on user input type.   - **Auto-formatting & Placeholders:**    - Input values are automatically formatted in real-time based on the applied mask.    - Use placeholders to guide users before they start typing.   3️⃣ Dynamic Updates   - Modify the **"Mask Type"** dynamically via workflows for different input formats.   - Adjust the mask conditionally depending on the user’s selection or data type.   Use Cases:   ✔ Format phone numbers, dates, and currency fields   ✔ Standardize CPFs, RGs, and vehicle plate inputs   ✔ Improve form usability with automatic formatting   4️⃣ Examples of Usage   - **Phone Number:** Mask: `(##) #####-####` → Input: `(21) 98765-4321`   - **CPF (Brazilian ID):** Mask: `###.###.###-##` → Input: `123.456.789-00`   - **RG (Brazilian ID):** Mask: `##.###.###-#` → Input: `12.345.678-9`   - **Vehicle Plate (New Format - Brazil):** Mask: `AAA#A##` → Input: `ABC1D23`   - **Postal Code (ZIP Code - Brazil):** Mask: `#####-###` → Input: `12345-678`   - **Currency (Custom - Numbers Only):** Mask: `###.###,##` → Input: `1.234,56`  

BR:   1️⃣ Configuração   - Instale o plugin e adicione o elemento **"Nebula - Custom Mask Input"** à sua página.   - Defina o campo **"Input ID"** para vincular ao campo de entrada onde a máscara será aplicada.   - Configure o campo **"Mask Type"** com o padrão de formatação desejado.   2️⃣ Personalização   - **Regras de Formatação da Máscara:**    - Use **"#"** para números (ex.: `"###-###"` para um código numérico).    - Use **"A"** para letras (ex.: `"AAA-####"` para uma placa de veículo).    - Combine ambos para criar formatos personalizados (ex.: `"AA-###.###"` para RGs).   - **Troca Dinâmica de Máscara:**    - Atualize a máscara dinamicamente usando workflows e condições.    - Altere o formato conforme o tipo de dado inserido.   - **Autoformatação & Placeholders:**    - Os valores digitados são automaticamente formatados conforme a máscara aplicada.    - Utilize placeholders para orientar os usuários antes do preenchimento.   3️⃣ Atualizações Dinâmicas   - Modifique a **"Mask Type"** dinamicamente via workflows para diferentes formatos de entrada.   - Ajuste a máscara condicionalmente, dependendo da seleção ou tipo de dado do usuário.   Casos de Uso:   ✔ Formatar números de telefone, datas e valores monetários   ✔ Padronizar entradas para CPFs, RGs e placas de veículos   ✔ Melhorar a usabilidade dos formulários com formatação automática   4️⃣ Exemplos de Uso   - **Telefone:** Máscara: `(##) #####-####` → Entrada: `(21) 98765-4321`   - **CPF:** Máscara: `###.###.###-##` → Entrada: `123.456.789-00`   - **RG:** Máscara: `##.###.###-#` → Entrada: `12.345.678-9`   - **Placa de Veículo (Novo Padrão - Brasil):** Máscara: `AAA#A##` → Entrada: `ABC1D23`   - **CEP:** Máscara: `#####-###` → Entrada: `12345-678`   - **Moeda (Customizado - Apenas Números):** Máscara: `###.###,##` → Entrada: `1.234,56`  

Types

This plugin can be found under the following types:

Categories

This plugin can be found under the following categories:
Technical   •   Productivity   •   Data (things)   •   Small Business   •   Email   •   Visual Elements

Resources

Support contact
Tutorial

Rating and reviews

Average rating (5.0)

Formata CPFs e CNPJs perfeitamente no app, nice!!
May 7th, 2025
Nice plugin!
March 17th, 2025
Bubble