# 🍾 Components ## Styles - **TextWrapper** over default Text component - Colors - Fonts - Theme - Font Size ## Imports Predefined **`h`** tags are usable with TextWrapper ```jsx import Text from "@shared-components/text-wrapper/Text"; // ? Advanced Usage Example Heading 3 Bold Right Sided Custom Text ; ``` ```jsx import colors from "@colors"; Heading 1 with custom color from theme ; ``` ```jsx import fonts from "@fonts"; Heading 1 with custom font usage ; ``` ```jsx import fontSize from "@font-size"; ``` ```jsx import theme from "@theme"; ``` if you want to call them all at once ```js import { theme, fonts, colors, spacing, fontSize } from "@shared-styles/index"; ```