UI
  • Home
  • Docs
Getting Started
  • Introduction
  • Installation
  • Layout
  • Colors
  • Spacing
  • Radius
  • Typography
Layout
  • Aspect Ratio
  • Card
  • Empty
  • Item
  • Separator
  • Tabs
  • Marquee
Input
  • Checkbox
  • Combobox
  • Date Picker
  • Field
  • Filters
  • Input
  • Input Group
  • InputOTP
  • Label
  • Number Input
  • Phone Input
  • Radio Group
  • Select
  • Slider
  • Switch
  • Toggle
  • Toggle Group
  • Textarea
Forms
  • React Hook Form
Navigation and actionables
  • Button
  • Breadcrumb
  • Collapsible
  • ContextMenu
  • Command
  • Dropdown Menu
  • Navigation Menu
  • Pagination
  • Sidebar
Data Display
  • Accordion
  • Alert
  • Alert Dialog
  • Avatar
  • Badge
  • Calendar
  • Card
  • Chart
  • Dialog
  • Drawer
  • Empty
  • Kbd
  • Popover
  • Progress
  • Sheet
  • Spinner
  • Toast
  • Tooltip
Utility
  • Aspect Ratio
  • Scroll Area
  • Separator
  • Skeleton

Typography

Typography used in the NerdfishUI library

Semantic classnames

typography-heading-xlAa
typography-heading-lgAa
typography-headingAa
typography-heading-smAa
typography-headlineAa
typography-titleAa
typography-subtitleAa
typography-bodyAa
typography-body-largeAa
typography-captionAa
typography-blockquoteAa

Lists

Unordered list

  • Id maxime optio soluta placeat ea eaque similique consectetur dicta tempore.
  • Repellat veritatis et harum ad sint reprehenderit tenetur, possimus tempora.
  • Lorem ipsum dolor sit amet consectetur adipisicing elit harum ad sint.

Ordered list

  • Id maxime optio soluta placeat ea eaque similique consectetur dicta tempore.
  • Repellat veritatis et harum ad sint reprehenderit tenetur, possimus tempora.
  • Lorem ipsum dolor sit amet consectetur adipisicing elit harum ad sint.

Blockquotes

"With this Golden Apple, I wish for the curse to be lifted and for prosperity to return to our kingdom," Sir Cedric said as he returned to the king.

Insert & Delete

Always Gonna Give You Up Never Gonna Give You Up

Mark

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nesciunt, aliquid. Molestias, odio illum voluptatibus natus dignissimos, quidem est unde aspernatur veniam pariatur fuga.

Typography

Chapter 1: The Beginning

Long ago, in a land far away, there was a magical kingdom ruled by a kind and just king. The kingdom was full of riches, and the people were happy and content. But one day, a dark sorcerer cast a curse upon the land, causing the crops to wither and the rivers to dry up.

Chapter 2: The Quest

The king, in his wisdom, knew that the only way to break the curse was to find the legendary Golden Apple. The Golden Apple was said to be guarded by a fierce dragon in a far-off land, and whoever could retrieve it would be granted one wish.

Chapter 3: The Journey

The king called forth his bravest knight, Sir Cedric, to undertake the quest for the Golden Apple. Sir Cedric set out on his journey, facing many dangers and obstacles along the way.

Chapter 4: The Battle

Sir Cedric finally reached the dragon's lair, where he was met with a fierce battle. But Sir Cedric was brave and skilled, and he was able to defeat the dragon and retrieve the Golden Apple.

"With this Golden Apple, I wish for the curse to be lifted and for prosperity to return to our kingdom," Sir Cedric said as he returned to the king.

The king was overjoyed and bestowed many honors upon Sir Cedric, including:

  • Knight of the Realm
  • Duke of the Kingdom
  • Protector of the Golden Apple

The curse was lifted, and the kingdom returned to its former glory. Sir Cedric was hailed as a hero and his legend lived on for generations to come.

The End

© Copyright 2025. All rights reserved.

Follow us on TwitterFollow us on GitHub