Note: On Windows keyboards, the Meta key (often the Windows key) has reserved system functions. In these cases, you can define an alternate key specifically for Windows users.
Note: On Windows keyboards, the Meta key (often the Windows key) has reserved system functions. In these cases, you can define an alternate key specifically for Windows users.
Note: On Windows keyboards, the Meta key (often the Windows key) has reserved system functions. In these cases, you can define an alternate key specifically for Windows users.
Note: On Windows keyboards, the Meta key (often the Windows key) has reserved system functions. In these cases, you can define an alternate key specifically for Windows users.
Note: On Windows keyboards, the Meta key (often the Windows key) has reserved system functions. In these cases, you can define an alternate key specifically for Windows users.
Note: On Windows keyboards, the Meta key (often the Windows key) has reserved system functions. In these cases, you can define an alternate key specifically for Windows users.
Note: On macOS keyboards, combinations that include the Command key often trigger browser or system shortcuts and can’t be used for custom interactions. To maintain compatibility, you can set an alternate key combination specifically for macOS users.
Note: On macOS keyboards, combinations that include the Command key often trigger browser or system shortcuts and can’t be used for custom interactions. To maintain compatibility, you can set an alternate key combination specifically for macOS users.
Note: On macOS keyboards, combinations that include the Command key often trigger browser or system shortcuts and can’t be used for custom interactions. To maintain compatibility, you can set an alternate key combination specifically for macOS users.
Note: On macOS keyboards, combinations that include the Command key often trigger browser or system shortcuts and can’t be used for custom interactions. To maintain compatibility, you can set an alternate key combination specifically for macOS users.
Note: On Windows keyboards, combinations that include the Control key often trigger browser shortcuts and can’t be used for custom actions. To ensure compatibility, you can define an alternate key combination specifically for Windows users.
Note: On Windows keyboards, combinations that include the Control key often trigger browser shortcuts and can’t be used for custom actions. To ensure compatibility, you can define an alternate key combination specifically for Windows users.
Note: On Windows keyboards, combinations that include the Control key often trigger browser shortcuts and can’t be used for custom actions. To ensure compatibility, you can define an alternate key combination specifically for Windows users.
Shift Key
The Shift key on either side of the keyboard can be used to display or toggle any kind of custom content. You can even target key combos. Try pressing the "Z" key while holding Shift.
Z Key
The "Z" key is currently being held. Try any combination of keys displayed in this section to see more targeted content.
Shift + Z Keys
The Shift key is currently being held in combination with the "Z" key. Release the Shift key to see content targeted by the "Z" key alone.
Shift + Control Keys
The Shift key is currently being held in combination with the Control key.
Shift + Control + Z Keys
The Shift key is currently being held in combination with the Control & "Z" keys.
Shift + Alt Keys
The Shift key is currently being held in combination with the Alt key.
Shift + Alt + Z Keys
The Shift key is currently being held in combination with the Alt & "Z" keys.
Shift + Control + Alt Keys
The Shift key is currently being held in combination with the Control & Alt keys.
Shift + Control + Meta Keys
The Shift key is currently being held in combination with the Control & Meta keys.
Shift + Alt + Meta Keys
The Shift key is currently being held in combination with the Alt & Meta keys.
Shift + Meta Keys
The Shift key is currently being held in combination with the Meta key.
Control Key
The Control key is currently being held. This is the only key in this row of modifier keys that is located in the same position on both macOS and Windows based keyboards.
Control + Z Keys
The Control key is currently being held in combination with the "Z" key.
Control + Alt Keys
The Control key is currently being held in combination with the Alt key.
Control + Alt + Z Keys
The Control key is currently being held in combination with the Alt & "Z" keys.
Control + Alt + Meta Keys
The Control key is currently being held in combination with the Alt & Meta keys.
Control + Meta Keys
The Control key is currently being held in combination with the Meta key.
Alt Key
The Alt key is currently being held. This is also know as the "Option" key on keyboards designed for macOS.
Alt + Z Keys
The Alt key is currently being held in combination with the "Z" key.
Alt + Meta Keys
The Alt key is currently being held in combination with the Meta key.
Meta Key
The "Meta" key is currently being held. This is known as the "Command" key for macOS based keyboards and the "Windows" key for Windows based keyboards.
Caps Lock is on
Caps Lock is currently active. Press the Caps Lock key to turn it off.
This Mod Key-triggered content is currently set to display in a fixed position. You can also choose to position it inline (static), or absolute depending on your layout needs.
caps lock
shift
Z
⌃
control
⌥
option
⌘
command
Press and hold the Shift key to see an example of Mod Key-triggered content.
Press and hold the Shift key to see an example of Mod Key-triggered content.
Custom Mod Key Support
In addition to the standard mod keys (like Option, Control, or Command), you can link your content to almost any key on the keyboard. Just type the label on the key (like A, Z, Backspace) or use its official name or numeric key code.
In addition to the standard mod keys (like Control or Alt), you can link your content to almost any key on the keyboard. Just type the label on the key (like A, Z, Backspace) or use its official name or numeric key code.
C
Press and hold the "C" key to view a location-based key code cheat sheet—especially helpful for non-U.S. keyboards.
C
Press and hold the "C" key to view a location-based key code cheat sheet—especially helpful for non-U.S. keyboards.
Multi-Key Toggle Support
You can require two or more keys to be pressed at the same time to trigger content visibility. These toggles can also be set to stay active after pressing (like a switch), rather than requiring users to keep the keys held down.
⌥
option
+
T
Press the Option & "T" keys at the same time to toggle more information.
Alt
+
T
Press the Alt, & "T" keys at the same time to toggle more information.
You can configure custom notes like the one above which intelligently detects the user's device to:
- Display relevant text for which key or keys to press
- Display a toggle instead of a note on touchscreen devices that lack easy access to a physical keyboard.
- Key labels: option+t
- Key names: Alt+KeyT
- Key codes: 18+84
Optional Onscreen Toggle
Want to support tablets or touch devices without physical keyboards? You can add an onscreen toggle button that appears only when needed—ideal for mobile users. Prefer to keep a toggle always visible? That’s possible too.
⌥
option
+
S
Press the Option & "S" keys at the same time to toggle more information or use the toggle.
Onscreen toggles can be configured to display only on touch screen devices. This way you can provide a way for page visitors who's devices do not have easily accessible keyboard input to also toggle hidden content.
Alt
+
S
Press the Alt, & "S" keys at the same time to toggle more information or use the toggle.
Onscreen toggles can be configured to display only on touch screen devices. This way you can provide a way for page visitors who's devices do not have easily accessible keyboard input to also toggle hidden content.
The toggle updates automatically, whether activated by keys or clicked directly—keeping everything in sync. You can also:
- Show different mod key or toggle instructions for Windows/macOS users
- Show or hide toggles based on device type (keyboard vs. touchscreen)
Swap Between Content
Instead of just showing or hiding content, you can also swap between two sets of content. By default, regular content is shown. When the keys (or toggle) are activated, the alternate content fades in—great for context-sensitive experiences.
For example, show "Office Use Only" fields when certain keys are pressed:
⌃
control
+
⌥
option
Press the Control & Option keys at the same time to swap in enabled "Office only" fields.
Onscreen toggles can be configured to display only on touch screen devices. This way you can provide a way for page visitors who's devices do not have easily accessible keyboard input to also toggle hidden content.
Ctrl
+
Alt
Press the Control, & Alt keys at the same time to swap in enabled "Office only" fields.
Onscreen toggles can be configured to display only on touch screen devices. This way you can provide a way for page visitors who's devices do not have easily accessible keyboard input to also toggle hidden content.
Example Form
Name
Address
ID Number
Employee Code
Purchase Notes
Mod Keys
Get Mod Keys today! Purchase includes an example project file that demonstrates the different features of the stack.
Contact
Have questions about the stack or need some help? Feel free to contact us at the link below. Most inquiries are replied to within 1-2 working days.
Newsletter
Join our newsletter to get notified when we have discounts, updates, and new releases!