Knapp

En knapp eller en länk som ser ut som en knapp.

Information

Plan: Personal

Exempel

Borstad metall - Standard

Borstad metall - Blå

Borstad metall - Guld

Gradient - Temabaserad

Mörk - Temabaserad

Egenskaper

Egenskap	Typ	Standard
Text	textsträng	"Text"
Länk	textsträng	""
ID	textsträng	""
Typ	uppräkning<textsträng>	""
Tema	uppräkning<textsträng>	""
Fontstorlek	textsträng	"1rem"
Fontvikt	textsträng	"600"
Teckenavstånd	textsträng	"normal"
Färg	textsträng	"var(--ophixor-semantic-text-primary)"
Färg - Mus över	textsträng	"var(--ophixor-semantic-text-primary)"
Färg - Primär	textsträng	"var(--ophixor-semantic-text-inverse)"
Färg - Primär - Mus över	textsträng	"var(--ophixor-semantic-text-inverse)"
Färg - Framgång	textsträng	"var(--ophixor-semantic-text-inverse)"
Färg - Framgång - Mus över	textsträng	"var(--ophixor-semantic-text-inverse)"
Färg - Varning	textsträng	"var(--ophixor-semantic-text-inverse)"
Färg - Varning - Mus över	textsträng	"var(--ophixor-semantic-text-inverse)"
Färg - Fara	textsträng	"var(--ophixor-semantic-text-inverse)"
Färg - Fara - Mus över	textsträng	"var(--ophixor-semantic-text-inverse)"
Radhöjd	textsträng	"1.2"
Textjustering	uppräkning<textsträng>	"inherit"
Textdekoration	textsträng	"none"
Texttransformering	uppräkning<textsträng>	"none"
Blanktecken	textsträng	"nowrap"
Bakgrund	textsträng	"none"
Bakgrund - Mus över	textsträng	"none"
Bakgrundsfärg	textsträng	"var(--ophixor-semantic-surface-base)"
Bakgrundsfärg - Mus över	textsträng	"var(--ophixor-semantic-surface-base)"
Bakgrund - Primär	textsträng	"none"
Bakgrund - Primär - Mus över	textsträng	"none"
Bakgrund - Framgång	textsträng	"none"
Bakgrund - Framgång - Mus över	textsträng	"none"
Bakgrund - Varning	textsträng	"none"
Bakgrund - Varning - Mus över	textsträng	"none"
Bakgrund - Fara	textsträng	"none"
Bakgrund - Fara - Mus över	textsträng	"none"
Bakgrundsfärg - Primär	textsträng	"var(--ophixor-semantic-interactive-primary)"
Bakgrundsfärg - Primär - Mus över	textsträng	"var(--ophixor-semantic-interactive-primary)"
Bakgrundsfärg - Framgång	textsträng	"var(--ophixor-semantic-status-success)"
Bakgrundsfärg - Framgång - Mus över	textsträng	"var(--ophixor-semantic-status-success)"
Bakgrundsfärg - Varning	textsträng	"var(--ophixor-semantic-status-warning)"
Bakgrundsfärg - Varning - Mus över	textsträng	"var(--ophixor-semantic-status-warning)"
Bakgrundsfärg - Fara	textsträng	"var(--ophixor-semantic-status-danger)"
Bakgrundsfärg - Fara - Mus över	textsträng	"var(--ophixor-semantic-status-danger)"
Bakgrundsbild	textsträng	""
Bakgrundsstorlek	textsträng	""
Bakgrundsposition	textsträng	""
Bakgrundsrepetering	textsträng	""
Bakgrundsblandningsläge	textsträng	""
Opacitet	textsträng	"1"
Opacitet - Inaktiverad	textsträng	"0.5"
Opacity - Hover	textsträng	"1"
Markör	textsträng	"pointer"
Markör - Inaktiverad	textsträng	"default"
Bårdfärg	textsträng	"var(--ophixor-semantic-border-default)"
Bårdfärg - Mus över	textsträng	"var(--ophixor-semantic-border-default)"
Bårdfärg - Primär	textsträng	"transparent"
Bårdfärg - Primär - Mus över	textsträng	"transparent"
Bårdfärg - Framgång	textsträng	"transparent"
Bårdfärg - Framgång - Mus över	textsträng	"transparent"
Bårdfärg - Varning	textsträng	"transparent"
Bårdfärg - Varning - Mus över	textsträng	"transparent"
Bårdfärg - Fara	textsträng	"transparent"
Bårdfärg - Fara - Mus över	textsträng	"transparent"
Bårdradie	textsträng	"4px"
Bårdbredd	textsträng	"1px"
Bårdbredd - Topp	textsträng	""
Bårdbredd - Höger	textsträng	""
Bårdbredd - Botten	textsträng	""
Bårdbredd - Vänster	textsträng	""
Bårdstil	textsträng	"solid"
Boxskugga	textsträng	"var(--ophixor-semantic-shadow-low)"
Boxskugga - Mus över	textsträng	"var(--ophixor-semantic-shadow-high)"
Boxskugga - Aktiv	textsträng	"var(--ophixor-semantic-shadow-low)"
Transformation - Mus över	textsträng	"translateY(-1px)"
Transformation - Aktiv	textsträng	"none"
Textskugga	textsträng	"none"
Textskugga - Mus över	textsträng	"none"
Transition	textsträng	"0.25s ease"
Kontur	textsträng	"none"
Kontur - Fokus	textsträng	"2px solid var(--ophixor-semantic-interactive-primary)"
Bakgrundsfilter	textsträng	"none"
Justera element längs tväraxeln	uppräkning<textsträng>	"center"
Justera element längs huvudaxeln	uppräkning<textsträng>	"center"
Justera sig själv längs tväraxeln	uppräkning<textsträng>	"auto"
Justera sig själv längs huvudaxeln	uppräkning<textsträng>	"auto"
Visningsläge	textsträng	"inline-flex"
Flexbox-riktning	textsträng	"row"
Flexbox-svep	textsträng	"nowrap"
Flexbox-växbarhet	textsträng	"0"
Flexbox-krympbarhet	textsträng	"1"
Överflöd	uppräkning<textsträng>	"visible"
Position	uppräkning<textsträng>	"relative"
Topp	textsträng	"auto"
Höger	textsträng	"auto"
Botten	textsträng	"auto"
Vänster	textsträng	"auto"
Z-index	textsträng	"auto"
Transformation	textsträng	"none"
Transformations-ursprung	textsträng	"50% 50% 0"
Marginal	textsträng	"0px"
Marginal topp	textsträng	""
Marginal höger	textsträng	""
Marginal botten	textsträng	""
Marginal vänster	textsträng	""
Vaddering	textsträng	"0.6rem 1rem"
Vaddering topp	textsträng	""
Vaddering höger	textsträng	""
Vaddering botten	textsträng	""
Vaddering vänster	textsträng	""
Mellanrum	textsträng	"0.5rem"
Bredd	textsträng	"auto"
Minsta bredd	textsträng	"0px"
Största bredd	textsträng	"none"
Höjd	textsträng	"auto"
Minsta höjd	textsträng	"0px"
Största höjd	textsträng	"none"
Vid klick	objekt	null
Inaktiverad	boolesk	false
Mål	textsträng	""
Relation	textsträng	""
Är synlig	boolesk	true
Selektorer	lista	[]

Varianter

Variant	Beskrivning
Borstad metall - Standard	Kommer inom kort...
Borstad metall - Blå	Kommer inom kort...
Borstad metall - Guld	Kommer inom kort...
Gradient - Temabaserad	Kommer inom kort...
Primär CTA	Kommer inom kort...
Sekundär	Kommer inom kort...
Spöke	Kommer inom kort...
Kontur	Kommer inom kort...
Fara	Kommer inom kort...
Länk	Kommer inom kort...
Mjuk	Kommer inom kort...
Glas	Kommer inom kort...
Fullbredds CTA	Kommer inom kort...
Kompakt	Kommer inom kort...
Ikonknapp	Kommer inom kort...
Upphöjd	Kommer inom kort...
Mörk - Temabaserad	Kommer inom kort...