3F Design v1.121.1
Documentation
Playground
Changelog
Guides
GIT (opens new window)
NPM (opens new window)
Documentation
Playground
Changelog
Guides
GIT (opens new window)
NPM (opens new window)
  • General

    • Getting Started
    • SEO Recommendations
    • Template Syntax
  • Layout

    • Page layout
    • Navigation
    • Hero
    • Footer
    • Grid
    • Utilities for layout
    • Color variants
  • Components

    • Accordion
    • Alerts
    • Announce
    • Button
    • Byline
    • Card
    • Datatable
    • Date
    • Embed
    • Fade
    • Feedback
    • Form
    • Icon
    • Image
    • Inline
    • Loading
    • Magazine
    • Map
    • Modal
    • PDF
    • Quote
    • Ribbon
      • Examples
        • Cards
        • Video
        • Gallery
      • API
    • Search
    • Searchable select
    • Stack
    • Tabs
    • Table
    • Tag
    • Text
    • Toast
  • Compositions

    • Article
    • Login
    • Discipline specific content
    • Display options and filtering
    • Paywall
    • Chat
    • Card content layouts
    • Who is who
    • Zig zag
    • New membership
    • Search results
    • Contact page
    • 3F en fagforening for mig
    • Hero slider
  • Utilities

    • Data
    • Fetch
    • Helpers
    • Internet Explorer
    • Render
    • Scroll-to
    • Session timeout
    • Tooltip
    • Tracking

# Ribbon

Component name: <v-ribbon>

# Examples

# Cards

# Video

# Gallery

# API

Name Type Description Default
color String Sets the background variant color for the v-ribbon wrapper.

Valid value: Color variant name or HEX color code
primary
position String Where to position the ribbon

Valid value: left or right
right

Notice

All other properties that are not defined above, will be passed to the component as html attributes. This is especially useful for adding the class attribute.

← Quote Search →