Styles

Changing the appearance, layout, and geometry of a block.

• width, maxWidth, minWidth
  The width of the block. Learn more.

• height, maxHeight, minHeight
  The height of the block. Learn more.

• overflow
  The method of displaying child elements when they take up excess space beyond the container. Learn more.

• padding, paddingHorizontal, paddingVertical, paddingTop, paddingRight, paddingBottom, paddingLeft
  Internal padding of the container. Learn more.

• margin, marginHorizontal, marginVertical, marginTop, marginRight, marginBottom, marginLeft
  External margins of the block. Learn more.

• position
  The positioning method of the block: relative or absolute. Learn more.

• top, right, bottom, left
  Offset from the original position. Learn more.

• color
  Text color. Learn more.

• fontFamily
  The name of the font family. Learn more.

• fontSize
  Font size. Learn more.

• fontStyle
  Ability to set the font to italic. Learn more.

• fontWeight
  Font weight. Learn more.

• fontVariant
  Ability to use monospaced digits. Learn more.

• letterSpacing
  The spacing between characters in the font. Learn more.

• lineClamp
  Limiting the height of text by the number of lines. Learn more.

• lineHeight
  The amount of space allocated for one line of text in height. Learn more.

• textAlign
  The principle of text alignment. Learn more.

• textAlignVertical
  Vertical alignment of text within the container. Learn more.

• textDecorationLine
  Adding underline or strikethrough to text. Learn more.

• textOverflow
  The method of truncating text when it exceeds the boundaries of the container. Learn more.

• textShadowColor
  The color of the text shadow. Learn more.

• textShadowOffset
  The offset of the shadow horizontally and vertically. Learn more.

• textShadowRadius
  The depth of the shadow blur in pixels. Learn more.

• textTransform
  Transformation of text upon display. Learn more.

• border
  Setting borders for the block on all four sides: thickness, style, and color. Learn more.

  

• borderTop, borderRight, borderBottom, borderLeft
  Setting individual borders for the sides of the block: thickness and color. Learn more.

• borderRadius, borderBottomLeftRadius, borderBottomRightRadius, borderTopLeftRadius, borderTopRightRadius
  Rounding the corners of the borders. Learn more.

• borderWidth, borderTopWidth, borderRightWidth, borderBottomWidth, borderLeftWidth
  Thickness of the borders. Learn more.

• borderColor, borderTopColor, borderRightColor, borderBottomColor, borderLeftColor
  Color of the borders. Learn more.

• backgroundColor
  Background color of the block. Learn more.

• backgroundGradient
  Background gradient of the block. Learn more.

• backgroundImage
  Address of the image for the background of the entire screen. Learn more.

• opacity
  Opacity of the entire block with its content. Learn more.

• elevation
  Height of the shadow. Learn more.

• shadowColor
  The color of the block's shadow. Learn more.

• flexDirection
  Defines the main axis of the container (the direction of blocks in the container). Learn more.

• flexBasis
  The initial size of the block along the main axis of the container. Learn more.

• flexGrow
  The growth factor of the block along the main axis of the container. Learn more.

• flexShrink
  The shrinkage factor of the block along the main axis of the container. Learn more.

• flex
  Specifies the behavior of the block's size (growth, shrinkage, and initial size) along the main axis of the container. Learn more.

• justifyContent
  Alignment and distribution of space along the main axis of the container. Learn more.

• alignItems
  Alignment across the main axis of the container. Learn more.

• alignContent
  Distribution of space across the main axis of the container. Learn more.

• alignSelf
  Alignment of a specific block across the main axis of the container. Learn more.

• flexWrap
  Wrapping blocks onto a new line along the main axis of the container. Learn more.

• transform
  Transforming the geometry of blocks and containers in 2D and 3D space. Learn more.