Inline with Text Kbd for React

Close to it. The Kbd's extra-small type sits well in small text like this paragraph. In larger body text, the caps read a bit smaller than the words, which is fine; if they look too small, raise their text size one step.

Ordinary spaces in the text, as here, are enough between a word and a cap. To keep the keys of one shortcut tight together, put them in a KbdGroup instead of separating them with spaces.

A KbdGroup marks the keys as one shortcut pressed together and spaces them evenly. Separate caps in the text read as separate keys. For a chord like ⌘K, a KbdGroup inside the sentence is usually clearer.

Yes. Kbd renders a kbd element, and screen readers read its text as part of the sentence. A symbol like ⌘ may be read as a symbol name or skipped, so for important instructions add the key's name as visually hidden text.

Usually not: the same cap in a sentence and next to a menu item helps people recognize shortcuts. If the caps look heavy in long text, a lighter fill on them is enough.

Separate caps can end up on different lines, splitting ⌘ from K. A KbdGroup doesn't wrap inside, so put chords in one to keep them together.