# Styling & theming > How to style the wb-* classes Mentionwell emits, override the defaults, or write your own theme from scratch. Mentionwell's writer emits a small, stable set of class names on its HTML. You have three options for styling: ## 1. Use the default theme (fastest) ```ts import "mentionwell-reader/styles"; ``` Drops in a tasteful default that matches a typical content blog. Inherits your existing font, but provides spacing, code blocks, callouts, image captions. ## 2. Override the defaults The default stylesheet uses CSS custom properties: ```css :root { --wb-text: #111; --wb-text-muted: #555; --wb-accent: #2a72ff; --wb-bg-code: #f6f8fa; --wb-radius: 12px; --wb-line-height: 1.7; /* ... */ } ``` Override these in your global CSS to match your brand without forking the stylesheet. ## 3. Write your own (most flexible) Don't import `mentionwell-reader/styles`. Instead, target the class names directly. The complete list: ```text .wb-article outermost wrapper .wb-header title + meta block .wb-section major content section .wb-tldr TL;DR card .wb-toc table of contents .wb-faq FAQ accordion .wb-figure image + caption .wb-callout inline callout .wb-code code block wrapper .wb-cta inline CTA button ``` Plus standard `

`, `

`, `

`, `