Title

For common title styles that you can manage from one component across project.

View Source 

Usage

@import "winduum/src/components/title/index.css" layer(components);

Variants

• default 

Props

• default 

Tokens

• sm
• lg

Installation

Follow instructions for individual framework usage below

• winduum 
• winduum-vue 
• winduum-react 

Examples

Basic

html

<div class="x-title">Title</div>

vue

<script setup lang="ts">
    import { Title } from '@/components/title'
</script>

<template>
    <Title>Title</Title>
</template>

jsx

import { Title } from '@/components/title'

export function Example() {
    return (
        <Title>Title</Title>
    )
}

Small

<h3 class="x-title sm">Title H3</h3>

Large

<h3 class="x-title lg">Title H1</h3>

Weight

<h3 class="x-title font-normal">Title H1</h3>

Uppercase

<div class="x-title uppercase">Title</div>

Color

<div class="x-title text-primary">Title</div>