-
Notifications
You must be signed in to change notification settings - Fork 30
Open
Description
all right, so we use this
"typeScale": [
3.25, 2.5, 1.25, 1, 0.75
],
to generate this
/*
TYPE SCALE
Docs: http://tachyons.io/docs/typography/scale/
Base:
f = font-size
Modifiers:
1 = 1st step in size scale
2 = 2nd step in size scale
3 = 3rd step in size scale
4 = 4th step in size scale
5 = 5th step in size scale
*/
.f1 { font-size: 3.25rem; }
.f2 { font-size: 2.5rem; }
.f3 { font-size: 1.25rem; }
.f4 { font-size: 1rem; }
.f5 { font-size: .75rem; }
This is totally fine, it's the tachyons way. however, communicating to a larger team when to use which font size is not always easy. Adding semantic meaning to scales helps making them easier to understand and read
Semantic proposal:
"typeScale": [
{"value": 3.25, "alias": "title"},
{"value": 2.5, "alias": "sub"},
{"value": 1.25, "alias": ["copy", "error"]},
1,
0.75
],
would generate this
/*
TYPE SCALE
Docs: http://tachyons.io/docs/typography/scale/
Base:
f = font-size
Modifiers:
1 = title
2 = sub
3 = copy, error
4 = 4th step in size scale
5 = 5th step in size scale
*/
.f1, .ftitle { font-size: 3.25rem; }
.f2, .fsub { font-size: 2.5rem; }
.f3, .fcopy, .ferror { font-size: 1.25rem; }
.f4 { font-size: 1rem; }
.f5 { font-size: .75rem; }
what do you think?
fturcheti and yumyo
Metadata
Metadata
Assignees
Labels
No labels