css

package
v0.1.2 Latest Latest
Warning

This package is not in the latest version of its module.

 Go to latest Published: Jun 2, 2026 License: Apache-2.0 Imports: 7 Imported by: 0

Documentation

Overview

Package css is responsible for the generation of CSS.

Index

Constants

This section is empty.

Variables

View Source 
var DefaultKeyColors = PresetKeyColors[0]
View Source 
var DefaultTypeFace = TypeFace{
	Brand:         "'Roboto Flex', system-ui, sans-serif",
	Plain:         "'Roboto Flex', system-ui, sans-serif",
	WeightRegular: 400,
	WeightMedium:  600,
}
View Source 
var DefaultTypeScale = TypeScale{
	DisplayLarge:   Font{DefaultTypeFace.Brand, 48, 42.75, 0, DefaultTypeFace.WeightRegular},
	DisplayMedium:  Font{DefaultTypeFace.Brand, 39, 33.75, 0, DefaultTypeFace.WeightRegular},
	DisplaySmall:   Font{DefaultTypeFace.Brand, 33, 27, 0, DefaultTypeFace.WeightRegular},
	HeadlineLarge:  Font{DefaultTypeFace.Brand, 30, 24, 0, DefaultTypeFace.WeightRegular},
	HeadlineMedium: Font{DefaultTypeFace.Brand, 27, 21, 0, DefaultTypeFace.WeightRegular},
	HeadlineSmall:  Font{DefaultTypeFace.Brand, 24, 18, 0, DefaultTypeFace.WeightRegular},
	TitleLarge:     Font{DefaultTypeFace.Brand, 21, 16.5, 0, DefaultTypeFace.WeightRegular},
	TitleMedium:    Font{DefaultTypeFace.Plain, 18, 12, 0.15, DefaultTypeFace.WeightMedium},
	TitleSmall:     Font{DefaultTypeFace.Plain, 15, 10.5, 0.1, DefaultTypeFace.WeightMedium},
	LabelLarge:     Font{DefaultTypeFace.Plain, 15, 10.5, 0.1, DefaultTypeFace.WeightMedium},
	LabelMedium:    Font{DefaultTypeFace.Plain, 12, 9, 0.5, DefaultTypeFace.WeightMedium},
	LabelSmall:     Font{DefaultTypeFace.Plain, 12, 8.25, 0.5, DefaultTypeFace.WeightMedium},
	BodyLarge:      Font{DefaultTypeFace.Plain, 18, 12, 0.5, DefaultTypeFace.WeightRegular},
	BodyMedium:     Font{DefaultTypeFace.Brand, 15, 10.5, 0.25, DefaultTypeFace.WeightRegular},
	BodySmall:      Font{DefaultTypeFace.Brand, 12, 9, 0.4, DefaultTypeFace.WeightRegular},
}
View Source 
var PresetKeyColors = []KeyColors{
	{
		Name:           "Green",
		Primary:        ParseColor("#426915"),
		Secondary:      ParseColor("#57624a"),
		Tertiary:       ParseColor("#386663"),
		Neutral:        ParseColor("#5e5f59"),
		NeutralVariant: ParseColor("#5c6054"),
		Error:          ParseColor("#ba1a1a"),
		OK:             ParseColor("#1aba1a"),
	}, {
		Name:           "Blue",
		Primary:        ParseColor("#215fa6"),
		Secondary:      ParseColor("#555f71"),
		Tertiary:       ParseColor("#6e5676"),
		Neutral:        ParseColor("#5e5e62"),
		NeutralVariant: ParseColor("#5b5e66"),
		Error:          ParseColor("#ba1a1a"),
		OK:             ParseColor("#1aba1a"),
	}, {
		Name:           "Yellow",
		Primary:        ParseColor("#636100"),
		Secondary:      ParseColor("#616042"),
		Tertiary:       ParseColor("#3e6656"),
		Neutral:        ParseColor("#605e58"),
		NeutralVariant: ParseColor("#605f51"),
		Error:          ParseColor("#ba1a1a"),
		OK:             ParseColor("#1aba1a"),
	}, {
		Name:           "Red",
		Primary:        ParseColor("#a03f28"),
		Secondary:      ParseColor("#77574f"),
		Tertiary:       ParseColor("#6d5d2e"),
		Neutral:        ParseColor("#655c5a"),
		NeutralVariant: ParseColor("#6c5b57"),
		Error:          ParseColor("#ba1a1a"),
		OK:             ParseColor("#1aba1a"),
	}, {
		Name:           "Violet",
		Primary:        ParseColor("#715573"),
		Secondary:      ParseColor("#005ac1"),
		Tertiary:       ParseColor("#575e71"),
		Neutral:        ParseColor("#5e5e62"),
		NeutralVariant: ParseColor("#5c5e66"),
		Error:          ParseColor("#ba1a1a"),
		OK:             ParseColor("#1aba1a"),
	}, {
		Name:           "Olive",
		Primary:        ParseColor("#705d00"),
		Secondary:      ParseColor("#675e40"),
		Tertiary:       ParseColor("#44664e"),
		Neutral:        ParseColor("#615e57"),
		NeutralVariant: ParseColor("#635e50"),
		Error:          ParseColor("#ba1a1a"),
		OK:             ParseColor("#1aba1a"),
	}, {
		Name:           "Meadow",
		Primary:        ParseColor("#006496"),
		Secondary:      ParseColor("#50606f"),
		Tertiary:       ParseColor("#66587b"),
		Neutral:        ParseColor("#5d5e61"),
		NeutralVariant: ParseColor("#595f65"),
		Error:          ParseColor("#ba1a1a"),
		OK:             ParseColor("#1aba1a"),
	}, {
		Name:           "Roses",
		Primary:        ParseColor("#9b4429"),
		Secondary:      ParseColor("#77574d"),
		Tertiary:       ParseColor("#6b5e2f"),
		Neutral:        ParseColor("#655c5a"),
		NeutralVariant: ParseColor("#6c5b56"),
		Error:          ParseColor("#ba1a1a"),
		OK:             ParseColor("#1aba1a"),
	}, {
		Name:           "Byzantine",
		Primary:        ParseColor("#8e437e"),
		Secondary:      ParseColor("#6f5767"),
		Tertiary:       ParseColor("#815341"),
		Neutral:        ParseColor("#635d60"),
		NeutralVariant: ParseColor("#675b62"),
		Error:          ParseColor("#ba1a1a"),
		OK:             ParseColor("#1aba1a"),
	}, {
		Name:           "New Mexico",
		Primary:        ParseColor("#705d00"),
		Secondary:      ParseColor("#675e40"),
		Tertiary:       ParseColor("#44664e"),
		Neutral:        ParseColor("#615e57"),
		NeutralVariant: ParseColor("#635e50"),
		Error:          ParseColor("#bd082f"),
		OK:             ParseColor("#1aba1a"),
	}, {
		Name:           "Miami Dolphins",
		Primary:        ParseColor("#006970"),
		Secondary:      ParseColor("#00658b"),
		Tertiary:       ParseColor("#4f5e7d"),
		Neutral:        ParseColor("#5d5f5a"),
		NeutralVariant: ParseColor("#5b6056"),
		Error:          ParseColor("#ae3100"),
		OK:             ParseColor("#1aba1a"),
	},
}

Functions

func ApproxTone 

func ApproxTone(rgb int, tone int) int

ApproxTone calculates an approximation of the HCT tonal level for a given color. It used a pre-calculated tonal map with a granularity of 0x08. Tone must be a number between 0 and 100.

Types

type Color 

type Color int

Color is an immutable structure that holds an ARGB color value.

func NewColor 

func NewColor(a, r, g, b int) Color

NewColor creates a color from its ARGB components.

func ParseColor 

func ParseColor(spec string) Color

ParseColor parses a color string in the format "#FF0000", "FF0000" or "rgba(255,0,0,1.0)".

func (Color) Channels 

func (color Color) Channels() (a, r, g, b int)

Channels returns the ARGB values of the color.

func (Color) Darken 

func (color Color) Darken(units int) Color

Darken darkens the color. Each unit is approx 5% decrease in brightness.

func (Color) Hover 

func (color Color) Hover() Color

Hover adjusts the color to highlight an element that is hovered.

func (Color) HoverActive 

func (color Color) HoverActive() Color

Hover adjusts the color to highlight an element that is hovered.

func (Color) IsBright 

func (color Color) IsBright() bool

IsBright indicates if the color is bright.

func (Color) IsDark 

func (color Color) IsDark() bool

IsDark indicates if the color is dark.

func (Color) Lighten 

func (color Color) Lighten(units int) Color

Lighten lightens the color. Each unit is approx 5% increase in brightness.

func (Color) Mix 

func (color Color) Mix(mixin Color, mixinWeightPct int) Color

Mix creates a new color that is a weighted average of two colors. The percentage gives weight to the mixin color. A percentage greater than 50 gives more weight to the mixin color. A percentage smaller than 50 gives more weight to the original color. A percentage of 50 averages the two colors equally.

func (Color) Rotate 

func (color Color) Rotate(degrees int) Color

Rotate rotates the hue of the color by a number of degrees (of 360).

func (Color) String 

func (color Color) String() string

String prints the color as #FF0000, or rgba(255,0,0,1.0) if it has an alpha channel.

func (Color) Tone 

func (color Color) Tone(tone int) Color

Tone returns an approximation of the color at a specified HCT tone. Tone 0 is black and tone 100 is white. 40 is considered the base tone.

type Font 

type Font struct {
	Family     string
	LineHeight float32
	Size       float32
	Tracking   float32
	Weight     int
}

Font is used to customize the style of the page. LineHeight and Size are in CSS points (pt). The Material design defaults use the px-equivalent values scaled by 12/16 (1pt = 1/72 in ≈ 1.333px at 96 dpi, so 12pt ≈ 16px).

type KeyColors 

type KeyColors struct {
	Name           string
	Primary        Color
	Secondary      Color
	Tertiary       Color
	Neutral        Color
	NeutralVariant Color
	Error          Color
	OK             Color
}

KeyColors are the Material key colors of the color scheme from which all the color tones are derived. https://m3.material.io/styles/color/the-color-system/key-colors-tones .

func KeyColorsFromString 

func KeyColorsFromString(s string) KeyColors

KeyColorsFromString deserializes the key colors from a string.

func (KeyColors) String 

func (kc KeyColors) String() string

String serializes the key colors to a string.

func (KeyColors) WriteCSSThemes 

func (kc KeyColors) WriteCSSThemes(w io.Writer) error

WriteCSSThemes writes the Material variables of the light and dark themes.

func (KeyColors) WriteCSSTones 

func (kc KeyColors) WriteCSSTones(w io.Writer) error

WriteCSSTones writes the 13 Material tones of the key color as CSS variables.

type TypeFace 

type TypeFace struct {
	Brand         string
	Plain         string
	WeightRegular int
	WeightMedium  int
}

TypeFace defines the default font families and weights used in the type scale.

type TypeScale 

type TypeScale struct {
	DisplayLarge   Font
	DisplayMedium  Font
	DisplaySmall   Font
	HeadlineLarge  Font
	HeadlineMedium Font
	HeadlineSmall  Font
	TitleLarge     Font
	TitleMedium    Font
	TitleSmall     Font
	LabelLarge     Font
	LabelMedium    Font
	LabelSmall     Font
	BodyLarge      Font
	BodyMedium     Font
	BodySmall      Font
}

TypeScale is a selection of font styles that can be used across an app, ensuring a flexible, yet consistent, style that accommodates a range of purposes. The Material Design type scale is a combination of 15 styles, each with an intended application and meaning. They’re assigned based on use (such as display or headline), and grouped more broadly into categories based on scale (such as large or small). Material Design’s default type scale uses Roboto for all titles, labels, and body text, creating a cohesive typography experience.

func (TypeScale) WriteCSS 

func (ts TypeScale) WriteCSS(w io.Writer) error

WriteCSS writes the 12 fonts of the type scale as CSS variables.

Source Files

View all Source files

Jump to

Keyboard shortcuts

? : This menu
/ : Search site
f or F : Jump to
y or Y : Canonical URL
go.dev uses cookies from Google to deliver and enhance the quality of its services and to analyze traffic. Learn more.