Skip to main content
The WiFi template creates QR codes that automatically connect users to your wireless network when scanned. This eliminates the need to manually type network names and passwords, making it perfect for guest networks, offices, cafes, and events.

​
How to create a WiFi QR code

  1. Select the WiFi tab in the generator
  2. Enter your network name (SSID)
  3. Enter the network password
  4. Select the security type (WPA/WPA2, WEP, or no password)
  5. Download your QR code and place it where guests can scan it
Most modern smartphones can scan WiFi QR codes directly from their camera app without requiring additional software.

​
Required fields

​
wifiData.ssid
string
required
The name of your WiFi network (Service Set Identifier). This is the network name that appears in the WiFi list on devices.
​
wifiData.password
string
The network password. Leave empty if your network has no password (open network).
​
wifiData.encryption
enum
default:"WPA"
The security protocol used by your network:
  • WPA - WPA/WPA2 (most common, recommended)
  • WEP - WEP (older, less secure)
  • nopass - No password (open network)
​
wifiData.hidden
boolean
default:"false"
Whether the network is hidden (doesn’t broadcast its SSID). Most networks should leave this as false.

​
WiFi QR code format

The generator uses the standard WiFi QR code format that’s recognized by iOS, Android, and other devices: 
WIFI:S:<SSID>;T:<encryption>;P:<password>;H:<hidden>;;

​
Format breakdown

  • S: Network name (SSID)
  • T: Authentication type (WPA, WEP, or nopass)
  • P: Network password
  • H: Hidden network flag (true/false)
  • ;; Double semicolon terminates the string

​
Example formats

WIFI:S:MyHomeWiFi;T:WPA;P:SecurePassword123;H:false;;
Standard secured network with WPA2 encryption

​
Use cases and scanning instructions

Guest WiFi in homes

Print and frame a WiFi QR code near your entrance so guests can easily connect without asking for the password.

Coffee shops and restaurants

Display WiFi QR codes on tables, menus, or receipts to provide instant customer access.

Office visitor networks

Place QR codes in reception areas or conference rooms for easy guest network access.

Events and conferences

Share event WiFi access through QR codes on badges, signage, or printed materials.

​
How to scan a WiFi QR code

iOS (iPhone/iPad):
  1. Open the Camera app
  2. Point at the QR code
  3. Tap the WiFi notification banner that appears
  4. Tap “Join” to connect
Android:
  1. Open the Camera app or WiFi settings
  2. Look for “Scan QR code” option in WiFi settings
  3. Point at the QR code
  4. Tap “Connect” when prompted
Some older Android devices may require a third-party QR scanner app that supports WiFi codes.

​
Implementation example

Here’s how the WiFi template works in the source code: 
// WiFi data state with all fields
const [wifiData, setWifiData] = useState({ 
  ssid: '', 
  password: '', 
  encryption: 'WPA', 
  hidden: false 
});

// QR value generation using WiFi format
useEffect(() => {
  switch (activeTab) {
    case 'wifi':
      setQrValue(
        `WIFI:S:${wifiData.ssid};T:${wifiData.encryption};P:${wifiData.password};H:${wifiData.hidden};;`
      );
      break;
    // ... other cases
  }
}, [activeTab, wifiData]);
The implementation constructs the standard WiFi QR format string using template literals, combining all four fields (SSID, encryption type, password, and hidden flag) into the proper format.
The WiFi template is located at lines 116-135 in src/components/QRGenerator.jsx. The state is initialized at line 11 with default encryption set to ‘WPA’ and hidden set to false.

​
Security considerations

Password visibility

The generated QR code contains your WiFi password in plain text format. Anyone who scans the code can see the password using a QR code reader app.

Guest networks recommended

For security, create a separate guest network with limited access rather than sharing your main network credentials.

Rotate passwords periodically

Change your guest network password regularly and update the QR codes accordingly.

Build docs developers (and LLMs) love

Get started for freeTalk to us