Canon Typographia

Reasonable defaults of typographic style for Web


While integrated, toolkit is supposed to be quite modular, if you wish to opt out or customize.


HERO HEADING

h1 Heading

h2 Heading

h3 Heading

h4 Heading

h5 Heading
h6 Heading

No color settings except for current color or inherit. Border, outline, ring, text decoration, placeholder, caret.

  1. a
  2. abbr
  3. address
  4. b
  5. blockquote
  6. button
  7. caption
  8. cite
  9. code
  10. dd
  11. del
  12. details
  13. dfn
  14. dl
  15. dt
  16. em
  17. fieldset
  18. h1, h2, h3, h4, h5, h6
  19. hr
  20. i
  21. ins
  22. input
  23. kbd
  24. label
  25. legend
  26. mark
  27. menu
  28. meter
  29. ol
  30. optgroup
  31. option
  32. output
  33. p
  34. param
  35. progress
  36. pre
  37. q
  38. s
  39. samp
  40. select
  41. small
  42. strong
  43. sub
  44. summary
  45. sup
  46. textarea
  47. u
  48. ul
  49. var
  50. wbr



Lead paragraph — place your intro catch phrase here.

Usual paragraph, not much to see here.

One line

Another paragraph. Note the whitespace between paragraphs. This one should be long, to not fit in one line.

Paragraph with abbreviation UI — means User Interface.