color.brand.green
#1B5E20
Machine-readable design base
Tokens
The atlas renders the current token file. These values can later drive SwiftUI, Figma variables, or generated CSS.
Color
Palette
color.brand.green-dark
#0D3B12
color.brand.green-light
#2E7D32
color.brand.accent
#4CAF50
color.brand.silver
#B8C4BA
color.brand.silver-muted
#8A948C
color.surface.background
#111111
color.surface.card
#1A2E1F
color.surface.green-card-start
#1E4028
color.surface.green-card-end
#162A1B
color.text.primary
#FFFFFF
color.text.secondary
rgba(255, 255, 255, 0.65)
color.text.muted
rgba(255, 255, 255, 0.40)
color.category.putting
#2E7D32
color.category.chipping
#F9A825
color.category.grand-jeu-legacy
#1565C0
color.category.approche-legacy
#C62828
color.category.scoring
#9AA69C
Space and radius
Dimensions
spacing.xs4pxspacing.sm8pxspacing.md12pxspacing.lg16pxspacing.xl24pxspacing.xxl32pxspacing.xxxl48pxradius.sm12pxradius.md16pxradius.lg20pxradius.pill50pxtypography.size.hero-title40pxtypography.size.section-title32pxtypography.size.body16pxtypography.size.body-small14pxtypography.size.caption12pxType and motion
Roles
typography.font-family.displayBebas Neuetypography.font-family.serifCormorant Garamondtypography.font-family.bodyIntertypography.size.hero-title40pxtypography.size.section-title32pxtypography.size.body16pxtypography.size.body-small14pxtypography.size.caption12pxmotion.duration.micro0.18smotion.duration.standard0.32smotion.duration.celebration2.4sSource
Raw JSON
{
"$schema": "https://www.designtokens.org/tr/2025.10/format/",
"$description": "Starter DTCG-style tokens for LineCard iOS. Draft values mirror Theme.swift as of build 58.",
"color": {
"brand": {
"green": {
"$type": "color",
"$value": "#1B5E20"
},
"green-dark": {
"$type": "color",
"$value": "#0D3B12"
},
"green-light": {
"$type": "color",
"$value": "#2E7D32"
},
"accent": {
"$type": "color",
"$value": "#4CAF50"
},
"silver": {
"$type": "color",
"$value": "#B8C4BA"
},
"silver-muted": {
"$type": "color",
"$value": "#8A948C"
}
},
"surface": {
"background": {
"$type": "color",
"$value": "#111111"
},
"card": {
"$type": "color",
"$value": "#1A2E1F"
},
"green-card-start": {
"$type": "color",
"$value": "#1E4028"
},
"green-card-end": {
"$type": "color",
"$value": "#162A1B"
}
},
"text": {
"primary": {
"$type": "color",
"$value": "#FFFFFF"
},
"secondary": {
"$type": "color",
"$value": "rgba(255, 255, 255, 0.65)"
},
"muted": {
"$type": "color",
"$value": "rgba(255, 255, 255, 0.40)"
}
},
"category": {
"putting": {
"$type": "color",
"$value": "#2E7D32"
},
"chipping": {
"$type": "color",
"$value": "#F9A825"
},
"grand-jeu-legacy": {
"$type": "color",
"$value": "#1565C0"
},
"approche-legacy": {
"$type": "color",
"$value": "#C62828"
},
"scoring": {
"$type": "color",
"$value": "#9AA69C"
}
}
},
"spacing": {
"xs": {
"$type": "dimension",
"$value": {
"value": 4,
"unit": "px"
}
},
"sm": {
"$type": "dimension",
"$value": {
"value": 8,
"unit": "px"
}
},
"md": {
"$type": "dimension",
"$value": {
"value": 12,
"unit": "px"
}
},
"lg": {
"$type": "dimension",
"$value": {
"value": 16,
"unit": "px"
}
},
"xl": {
"$type": "dimension",
"$value": {
"value": 24,
"unit": "px"
}
},
"xxl": {
"$type": "dimension",
"$value": {
"value": 32,
"unit": "px"
}
},
"xxxl": {
"$type": "dimension",
"$value": {
"value": 48,
"unit": "px"
}
}
},
"radius": {
"sm": {
"$type": "dimension",
"$value": {
"value": 12,
"unit": "px"
}
},
"md": {
"$type": "dimension",
"$value": {
"value": 16,
"unit": "px"
}
},
"lg": {
"$type": "dimension",
"$value": {
"value": 20,
"unit": "px"
}
},
"pill": {
"$type": "dimension",
"$value": {
"value": 50,
"unit": "px"
}
}
},
"typography": {
"font-family": {
"display": {
"$type": "fontFamily",
"$value": "Bebas Neue"
},
"serif": {
"$type": "fontFamily",
"$value": "Cormorant Garamond"
},
"body": {
"$type": "fontFamily",
"$value": "Inter"
}
},
"size": {
"hero-title": {
"$type": "dimension",
"$value": {
"value": 40,
"unit": "px"
}
},
"section-title": {
"$type": "dimension",
"$value": {
"value": 32,
"unit": "px"
}
},
"body": {
"$type": "dimension",
"$value": {
"value": 16,
"unit": "px"
}
},
"body-small": {
"$type": "dimension",
"$value": {
"value": 14,
"unit": "px"
}
},
"caption": {
"$type": "dimension",
"$value": {
"value": 12,
"unit": "px"
}
}
}
},
"motion": {
"duration": {
"micro": {
"$type": "duration",
"$value": {
"value": 0.18,
"unit": "s"
}
},
"standard": {
"$type": "duration",
"$value": {
"value": 0.32,
"unit": "s"
}
},
"celebration": {
"$type": "duration",
"$value": {
"value": 2.4,
"unit": "s"
}
}
}
}
}