Forms

RTL VerifiedLTR Verified Forms

Copy Button with Confirmation

Actually copies, with a fallback when clipboard permission is unavailable

Intermediate Buttons

Code Prompt

RTL VerifiedLTR Verified Forms

Hold-to-Delete

The delete completes after a sustained press and aborts on release

Advanced Buttons

Code Prompt

RTL VerifiedLTR Verified Forms

Icon Buttons with Tooltips

Each has an accessible name, and the tooltip shows on focus, not hover alone

Intermediate Buttons

Code Prompt

RTL VerifiedLTR Verified Forms

Async Loading Button

Blocks the double click and holds its width while pending

Advanced Buttons

Code Prompt

RTL VerifiedLTR Verified Forms

Magnetic Button

Leans toward the pointer within range, and stops when motion is reduced

Advanced Buttons

Code Prompt

RTL VerifiedLTR Verified Forms

Progress-in-Button

Progress lives inside the button, and the upload can be cancelled mid-flight

Advanced Buttons

Code Prompt

RTL VerifiedLTR Verified Forms

Segmented Control

Single choice with a sliding indicator measured from the active segment

Intermediate Buttons

Code Prompt

RTL VerifiedLTR Verified Forms

Expanding Share Buttons

One button expands into options, with a counter that actually increments

Intermediate Buttons

Code Prompt

RTL VerifiedLTR Verified Forms

Base Buttons with States

Four levels of emphasis, five states each

Beginner Buttons

Code Prompt

RTL VerifiedLTR Verified Forms

Split Button

The default action is one click; its alternatives sit behind an arrow

Advanced Buttons

Code Prompt

RTL VerifiedLTR Verified Forms

Quantity Stepper

Respects stock and minimum, recomputing the line total instantly

Advanced Buttons

Code Prompt

RTL VerifiedLTR Verified Forms

Toggle Switches

State announced to screen readers, with computed dependency between switches

Intermediate Buttons

Code Prompt

RTL VerifiedLTR Verified Forms

Checkbox & Radio Group

Checkboxes accumulate, radios exclude — and the requirement is the group's, so it is stated where the role's semantics accept it

Intermediate Inputs

Code Prompt

RTL VerifiedLTR Verified Forms

File Upload / Dropzone

A dropzone whose native input is present, not hidden — so the keyboard reaches it and a screen reader names it, and the bar is a native element

Intermediate Inputs

Code Prompt

RTL VerifiedLTR Verified Forms

Hijri Date Picker

Hijri and Gregorian together, one tap to switch

★ Arabic only Advanced Hijri Date Picker

Code Prompt

RTL VerifiedLTR Verified Forms

Number Field

A number field with its bounds and step — what you add and step is a number, what identifies is text

Beginner Inputs

Code Prompt

RTL VerifiedLTR Verified Forms

Select / Combobox

A native list with no JavaScript — the placeholder shows but cannot answer, so the constraint genuinely fails on it

Beginner Inputs

Code Prompt

RTL VerifiedLTR Verified Forms

Setup Wizard

Progress follows reading order

Intermediate Setup Wizard

Code Prompt

RTL VerifiedLTR Verified Forms

Slider / Range

A native range kept in its own direction — never flipped by a trick, and the visible readout hidden from AT because the control already announces its value

Intermediate Inputs

Code Prompt

RTL VerifiedLTR Verified Forms

Text Field

Six states of one field — each a real attribute a screen reader can hear, not a class that only colours

Beginner Inputs

Code Prompt

RTL VerifiedLTR Verified Forms

Textarea

A multiline field whose counter reads the value length in the same unit maxlength stops typing by

Intermediate Inputs

Code Prompt

RTL VerifiedLTR Verified Forms

Time Field

A time field with its bounds and step — what happens during the day is a time, what adds up is a duration

Beginner Inputs

Code Prompt