Skip to content

Title

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

View Source 

Usage

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

Variants

  • default 

Props

  • default-props 

Tokens

  • sm
  • lg

Installation

Follow instructions for individual framework usage below

  • winduum 
  • winduum-vue 
  • winduum-react 

Examples

Basic

html
<div class="ui-title">Title</div>
vue
<script setup lang="ts">
    import { UiTitle } from '@/components/ui/title'
</script>

<template>
    <UiTitle>Title</UiTitle>
</template>
jsx
import { UiTitle } from '@/components/ui/title'

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

Small

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

Large

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

Weight

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

Uppercase

html
<div class="ui-title uppercase">Title</div>

Color

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

Released under the MIT License.