Components

Layout

Layout components in Osirion.Blazor.Core: page shell, footer, sticky sidebar, loading spinner and background patterns, all working under static SSR. Read the overview

• OsirionPageLayout

  A header, main and footer page shell with a sticky footer, a header that hides on scroll and a skip link to the main content.

• OsirionPageLoading

  A centered CSS spinner with an optional line of text, for content that is still loading during streaming rendering or an interactive render.

• OsirionFooter

  A site footer with link sections, social links, a copyright line, legal links and free content slots, rendered on the server without script.

• OsirionStickySidebar

  An aside that stays in view while the page scrolls, with its own scroll area, for a table of contents or docs navigation. Pure CSS.

• OsirionBackgroundPattern

  A decorative CSS background layer (dots, grid, diagonal lines, honeycomb and more) drawn in the theme's primary color behind a section.

Navigation

The navigation components in Osirion.Blazor (breadcrumbs, read more link, menu, scroll to top and enhanced navigation) and when to use each. Read the overview

• OsirionBreadcrumbs

  OsirionBreadcrumbs turns a URL path into an accessible breadcrumb trail, with a home link, custom segment text and the page title as the last crumb.

• OsirionReadMoreLink

  OsirionReadMoreLink renders a read more or call-to-action link with an optional icon, six variants, three sizes and a stretched mode for cards.

• Menu

  Menu renders a responsive site menu with submenus, mega menus and a mobile drawer that open with CSS only. Parameters of the menu and its parts.

• ScrollToTop

  ScrollToTop renders a fixed back to top button that appears after a scroll threshold. ScrollToTopProvider renders it from settings registered once.

• EnhancedNavigation

  EnhancedNavigation scrolls to the top of the new page after a Blazor enhanced navigation. It renders only an inline script.

Content

Components for the body of articles and docs pages in Osirion.Blazor Core, from callouts and tabs to video embeds and the HTML renderer, rendering under static SSR. Read the overview

• OsirionArticleMetdata

  OsirionArticleMetdata shows an article's author, publish date and read time in one line with icons, and renders nothing when all three are empty.

• OsirionCallout

  Highlight a note, tip, important point, warning or caution in content, written in Markdown with GitHub's alert syntax or with the OsirionCallout component.

• OsirionTabs

  OsirionTabs and OsirionTab show alternative content behind tabs that switch without script and work with the keyboard, under static SSR.

• Accordion and FAQ

  OsirionAccordion builds collapsible sections on the native details element; OsirionFaq renders questions and answers with FAQPage structured data.

• OsirionResponsiveImage

  OsirionResponsiveImage renders an img with intrinsic size, srcset, sizes and lazy loading, so images neither shift the layout nor load too large.

• OsirionVideoEmbed

  OsirionVideoEmbed shows a YouTube or Vimeo thumbnail and loads the player only when pressed, privacy-enhanced by default; without script it links to the video.

• OsirionReadingProgress

  OsirionReadingProgress shows a bar at the top of the window that fills as the reader scrolls, driven by a CSS scroll-driven animation with no script.

• OsirionHtmlRenderer

  OsirionHtmlRenderer sanitizes and renders HTML in Blazor, with Prism syntax highlighting loaded with SRI, line numbers, copy buttons and live demos.

• OsirionReveal

  OsirionReveal fades or slides content into view when it first scrolls into the viewport, as a small script enhancement.

• OsirionContentDemo

  OsirionContentDemo renders a registered Razor component as a live example, with Preview and Code tabs, in Markdown content or on a page.

Sections

Page sections from Osirion.Blazor Core, from heroes and content sections to pricing tables and numbered steps, rendering under static SSR. Read the overview

• HeroSection

  HeroSection renders a page header with a title, subtitle, buttons, article metadata and a side image, background image or pattern.

• OsirionBaseSection

  OsirionBaseSection renders a page section with an id, heading, description, framework container, padding and an optional background image or pattern.

• OsirionContactInfoSection

  OsirionContactInfoSection lists an address, phone numbers, email addresses and websites as links, with labels, icons and validated URLs.

• OsirionPricingTable and OsirionFeatureComparison

  OsirionPricingTable shows plans side by side with a highlighted plan; OsirionFeatureComparison compares their features in an accessible table.

• OsirionSteps

  OsirionSteps renders numbered how it works steps as an ordered list, side by side or stacked with a line joining the numbers.

• OsirionResponsiveShowcaseSection

  OsirionResponsiveShowcaseSection previews content in a frame that switches between desktop, tablet and mobile widths, for demo and docs pages.

• InfiniteLogoCarousel

  InfiniteLogoCarousel shows client or partner logos in a row that can loop continuously, with light and dark logo variants and optional links.

• OsirionTestimonialCarousel

  OsirionTestimonialCarousel shows testimonial cards in a continuously looping rail, driven by CSS, with a pause button and a static grid under reduced motion.

• OsirionMetricGrid

  OsirionMetricGrid lays out metric cards as a responsive list, described by records. Parameters, behavior and styling.

• OsirionContextCardGrid

  OsirionContextCardGrid renders a heading and a grid of labeled detail cards with an accent color. Parameters, behavior and styling.

• OsirionPageHeading

  OsirionPageHeading renders a page title as the h1 with an optional sentence below it. Parameters, behavior and styling.

Cards

The card components in Osirion.Blazor.Core (feature, testimonial, subscription, metric and author cards) and when to use each. Read the overview

• OsirionFeatureCard

  OsirionFeatureCard renders an image, a title, a description and optional links in one card. Parameters, behavior and styling.

• OsirionTestimonialCard

  OsirionTestimonialCard shows a quote with the person's name, photo, role, an optional star rating and a link. Parameters and behavior.

• OsirionSubscriptionCard

  OsirionSubscriptionCard is a newsletter signup form that works under static SSR, with validation, a honeypot and optional topic choices.

• OsirionAuthorCard

  OsirionAuthorCard introduces an author with avatar or initials, name, role, bio and profile links. Renders without script.

• OsirionMetricCard

  OsirionMetricCard shows one figure with a label and supporting text, and can count its number up when the card scrolls into view.

Forms and feedback

The contact form, the cookie and announcement banners, and the not-found state from Osirion.Blazor.Core. All of them post or render on the server under static SSR. Read the overview

• OsirionContactForm

  A contact form that validates on the server, blocks simple bots with a honeypot and sends mail through SMTP, SendGrid or Infobip, without script.

• OsirionCookieConsent

  A cookie consent banner that works without script, records the visitor's choice per category in a cookie and can gate analytics trackers.

• OsirionAnnouncementBar

  A site-wide announcement above the page that visitors can close without script; the dismissal is remembered in a cookie per announcement.

• OsirionContentNotFound

  OsirionContentNotFound renders a 404 or empty state with an error code, message, buttons, suggested links, a search slot and a contact address.

CMS pages

Components that list, render and describe CMS content in Osirion.Blazor, plus the sitemap and feed endpoints. Read the overview

• ContentList

  List content items from the default provider as a grid of cards, filtered by directory, category, tag, author or search, with query-string pagination.

• ContentView

  Render one content item as an article: title, author, date, reading time, featured image, sanitized body, categories, tags and previous and next links.

• LocalizedContentView

  Render one content item with links to its translations, locale-aware category and tag links, a sanitized body and optional previous and next links.

• ContentPage

  Load a content item by URL and lay it out with breadcrumbs, translation links, previous and next links, a sidebar, share links and related items.

• ContentRenderer

  Render only the sanitized HTML body of a content item, with code highlighting from OsirionHtmlRenderer, and build the rest of the page yourself.

• ArticlePage

  ArticlePage renders a whole article page from one content item: head metadata, hero, breadcrumbs, body, series and article navigation, related articles and a sidebar.

• DocumentPage

  DocumentPage renders a documentation page from one content item: side navigation, breadcrumbs, table of contents, body, edit link and previous and next links.

• HomePage

  HomePage renders a home page from one content item: head metadata, a hero, the Markdown body, a featured content section and an optional browse section.

• LandingPage

  LandingPage renders a marketing page from one content item or from parameters: a hero, a Markdown body in a configurable section, custom HTML and your own content.

• AboutPage

  AboutPage renders an about page from one content item, found by the slug about: a heading, the Markdown body and your own content such as author cards.

• ContactPage

  ContactPage renders a contact page: a heading, an optional Markdown introduction from content, and a contact form with your contact details beside it.

• NotFoundPage

  NotFoundPage renders a page not found page: a title, a way home, an optional search box and suggested pages, with noindex and status 404.

CMS navigation

Components that link CMS content: categories, tags, breadcrumbs, directories, previous and next links, series, table of contents and search. Read the overview

• CategoriesList

  CategoriesList renders a link to every content category with its item count, loaded from the default CMS content provider.

• ContentBreadcrumbs

  ContentBreadcrumbs renders a breadcrumb trail from a CMS item's directory chain: home, each parent directory and the item title.

• DirectoryNavigation

  DirectoryNavigation renders a list of CMS directories you pass, with one level of subdirectories, an active directory and click callbacks.

• LocalizedNavigation

  LocalizedNavigation loads the CMS directory tree for one locale and renders it with links to directories and their content items.

• OsirionContentNavigation

  OsirionContentNavigation renders previous and next links between CMS items of the same directory, found by front matter order.

• SearchBox

  SearchBox renders a search form that submits the query with GET to a results page, with no script, under static SSR and interactive modes.

• ContentSeriesNavigation

  ContentSeriesNavigation shows an item's place in a series, lists the parts and links the previous and next part, from series front matter.

• TableOfContents

  TableOfContents reads the headings of an HTML string, such as a rendered CMS item, and renders links to them as a nested list.

• TagCloud

  TagCloud renders a link to every content tag with its item count, loaded from the default CMS provider or from a list you pass.

SEO and feeds

The Osirion.Blazor.Cms.Web pieces that tell search engines and feed readers about your content, SeoMetadataRenderer and the sitemap and feed endpoints. Read the overview

• SeoMetadataRenderer

  Write the page title, meta description, canonical URL, robots, Open Graph, Twitter Card and JSON-LD tags for a content item or a list of items.

• Feeds and Sitemap

  Serve /sitemap.xml, an RSS feed at /feed.xml and an Atom feed at /atom.xml from your published content with MapOsirionFeeds and OsirionFeedOptions.

Analytics

The six analytics tracker components in Osirion.Blazor.Analytics (Clarity, GA4, Matomo, Plausible, Umami and Yandex Metrica) and what they share. Read the overview

• ClarityTracker

  ClarityTracker writes the Microsoft Clarity tracking script into the page head from configuration, with an optional consent gate.

• GA4Tracker

  GA4Tracker writes the Google Analytics 4 gtag.js snippet into the page head from configuration, with Consent Mode when the consent gate is on.

• MatomoTracker

  MatomoTracker writes the Matomo tracking script into the page head from configuration and reports page views after enhanced navigation.

• PlausibleTracker

  PlausibleTracker writes the Plausible Analytics script and its init call into the page head from configuration.

• UmamiTracker

  UmamiTracker writes the Umami script tag, configured through data attributes, into the page head from configuration.

• YandexMetricaTracker

  YandexMetricaTracker writes the Yandex Metrica counter script into the page head from configuration and reports page views after enhanced navigation.

Install, registration, configuration and the consent gate for all six trackers

Theming

Six color palettes for Osirion.Blazor, in light and dark. Try them on this site, see every color token they set, and make your own. Read the overview

• OsirionStyles

  OsirionStyles links the Osirion stylesheets and the CSS framework adapter, and applies the visitor's light or dark theme as the page loads.

• ThemeToggle

  ThemeToggle renders a button that switches the site between light and dark in the browser and remembers the choice in a cookie.

• Palettes

  Named color palettes for Osirion components, each with a light and a dark variant that meets WCAG 2.2 AA, chosen in configuration or by the visitor, applied before the first paint.

• ThemePicker

  ThemePicker renders a labelled list from which visitors pick a color palette; the choice applies at once and is remembered in a cookie.

Setup, options and the CSS framework adapters