Even though Sizzy doesn't simulate different browser rendering engines, we're trying our best to bring you the best simulation experience.

So far, we're simulating:

• Device Size
• Device Frame
• Device Pixel Ratio
• Device User-Agent
• Input type
• Operating System UI
• Browser UI

In this version, we added a software keyboard, which will bring you even closer to the real experience.

Behaviour

The default behaviour is that the keyboard will automatically pop up whenever you are focused on an input field, whether that's by clicking or by pressing tab.

You can change this behaviour for all devices by clicking on the keyboard icon in the plugins section:

You can also change this per device if you want to test different scenarios on different devices by going to the device menu and choosing "Keyboard Mode":

Input types

The keyboard shows different modes for:

• Text input
• Password input (hides the autocomplete row)
• Number input

We'll add more modes and customizations in the future.

Not purely cosmetic

The keyboard actually restricts the viewport height, just like a real device would do. Also, the centring field behaviour is different on iOS and Android devices, so we tried to match them accordingly. There are a few edge cases left and hopefully, we'll handle them in the future.

The keyboard is resizable

You can resize the keyboard by dragging the top edge. The size you choose will be persisted for the device.

There is not a standard keyboard height for every platform. It varies depending on a lot of things like the type of input (text, number, URL), whether autocomplete suggestions are enabled, the device's font size settings, etc. Android also allows user to directly customize keyboard height and some devices with bezel-less bottom add some padding below the keyboard to raise the keyboard.