For AI agents: the complete documentation index is at llms.txt. Markdown versions are available by appending .md or sending Accept: text/markdown.
Reflex Logo
Docs Logo
Library

/

Typography

/

Code

Code

console.log()

Size

Use the size prop to control text size. This prop also provides correct line height and corrective letter spacing—as text size increases, the relative line height and letter spacing decrease.

console.log()console.log()console.log()console.log()console.log()console.log()console.log()console.log()console.log()

Weight

Use the weight prop to set the text weight.

console.log()console.log()console.log()console.log()

Variant

Use the variant prop to control the visual style.

console.log()console.log()console.log()console.log()

Color

Use the color_scheme prop to assign a specific color, ignoring the global theme.

console.log()console.log()console.log()console.log()

High Contrast

Use the high_contrast prop to increase color contrast with the background.

console.log()console.log()console.log()console.log()
console.log()console.log()console.log()console.log()
Expand

API Reference

rx.code

A block level extended quotation.

Preview
rx.code(
variant="classic",
size="1",
weight="light",
color_scheme="tomato",
high_contrast=False,
)
variant
size
weight
color_scheme
high_contrast

Props

PropTypeDescription
access_key
str

Provides a hint for generating a keyboard shortcut for the current element.

auto_capitalize
"off""none""on""sentences""words""characters"

Controls whether and how text input is automatically capitalized as it is entered/edited by the user.

content_editable
"inherit""plaintext-only"

Indicates whether the element's content is editable.

context_menu
str

Defines the ID of a <menu> element which will serve as the element's context menu.

dir
str

Defines the text direction. Allowed values are ltr (Left-To-Right) or rtl (Right-To-Left).

draggable
bool

Defines whether the element can be dragged.

enter_key_hint
"enter""done""go""next""previous""search""send"

Hints what media types the media element is able to play.

hidden
bool

Defines whether the element is hidden.

input_mode
"none""text""tel""url""email""numeric""decimal""search"

Defines the type of the element.

item_prop
str

Defines the name of the element for metadata purposes.

lang
str

Defines the language used in the element.

role
"alert""alertdialog""application""article""banner""button""cell""checkbox""columnheader""combobox""complementary""contentinfo""definition""dialog""directory""document""feed""figure""form""grid""gridcell""group""heading""img""link""list""listbox""listitem""log""main""marquee""math""menu""menubar""menuitem""menuitemcheckbox""menuitemradio""navigation""none""note""option""presentation""progressbar""radio""radiogroup""region""row""rowgroup""rowheader""scrollbar""search""searchbox""separator""slider""spinbutton""status""switch""tab""table""tablist""tabpanel""term""textbox""timer""toolbar""tooltip""tree""treegrid""treeitem"

Defines the role of the element.

slot
str

Assigns a slot in a shadow DOM shadow tree to an element.

spell_check
bool

Defines whether the element may be checked for spelling errors.

tab_index
int

Defines the position of the current element in the tabbing order.

title
str

Defines a tooltip for the element.

variant
"classic""solid""soft""surface""outline""ghost"

The visual variant to apply: "solid" | "soft" | "outline" | "ghost".

size
"1""2""3""4""5""6""7""8""9"

Text size: "1" - "9".

weight
"light""regular""medium""bold"

Thickness of text: "light" | "regular" | "medium" | "bold".

color_scheme
"tomato""red""ruby""crimson""pink""plum""purple""violet""iris""indigo""blue""cyan""teal""jade""green""grass""brown""orange""sky""mint""lime""yellow""amber""gold""bronze""gray"

Overrides the accent color inherited from the Theme.

high_contrast
bool

Whether to render the text with higher contrast color.

Built with Reflex