typography
What's your type?

Typography Styles

This is a page of base typography styles for kernl(ui).

This is a lead paragraph ( @ 1.25rem). The pixel values currently shown on this page are rounded to the nearest whole-number in pixels from a rem value times the -pixel html base as read from the last page load (note that, for now, you'll need to refresh the page if you resize the viewport and want to see the updated pixel values for that viewport width).

  • 15px base font-size (xs)
  • 16px base font-size (sm, md, and lg)
  • 17px base font-size (xl)
  • 18px base font-size (xx)

Body copy ( @ 1rem) Cras mattis consectetur purus sit amet fermentum. Donec id elit non mi porta gravida at eget metus. Donec ullamcorper nulla non metus auctor fringilla. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam id dolor id nibh ultricies vehicula ut id elit. Nullam id dolor id nibh ultricies vehicula ut id elit. Nullam quis risus eget urna mollis ornare vel eu leo.

Body copy ( @ 1rem) in a nested banner. Cras mattis consectetur purus sit amet fermentum. Donec id elit non mi porta gravida at eget metus. Donec ullamcorper nulla non metus auctor fringilla. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam id dolor id nibh ultricies vehicula ut id elit. Nullam id dolor id nibh ultricies vehicula ut id elit. Nullam quis risus eget urna mollis ornare vel eu leo.

This a little note set at fs-sm ( @ 0.88rem).

Here is a Heading Two ( @ 1.88rem)

This is a lead paragraph ( @ 1.24rem). The pixel values currently shown on this page are rounded to the nearest whole-number in pixels from a rem value times the -pixel html base

Vestibulum id ligula porta felis euismod semper. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec ullamcorper nulla non metus auctor fringilla. Maecenas sed diam eget risus varius blandit sit amet non magna.

Heading Three and Listy Lists ( @ 1.53rem)

A Heading Four You

Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Donec sed odio dui. Aenean lacinia bibendum nulla sed consectetur. Maecenas sed diam eget risus varius blandit sit amet non magna. Aenean lacinia bibendum nulla sed consectetur.

Default List Style

  • Color — Nullam quis risus eget urna mollis ornare vel eu leo.
  • Typography — Aenean lacinia bibendum nulla sed consectetur.
    • Font family — Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.
    • Font style — Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Nullam quis risus eget urna mollis ornare vel.
      • Normal — Nullam quis risus eget urna mollis ornare vel eu leo.
      • ItalicAenean lacinia bibendum nulla sed consectetur.
      • BoldVivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.
      • Bold ItalicFusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.
    • Line-height (leading) — Nullam quis risus eget urna mollis ornare vel eu leo.
    • Letter-spacing (tracking) — Aenean lacinia bibendum nulla sed consectetur.
  • Imagery — Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.
    • Photography — Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.
    • Illustration — Nullam quis risus eget urna mollis ornare vel eu leo.
    • Scalable Vector Graphics SVGAenean lacinia bibendum nulla sed consectetur.

Here's some trailing text for showing some flow. Donec sed odio dui. Nulla vitae elit libero, a pharetra augue. Sed posuere consectetur est at lobortis. Vestibulum id ligula porta felis euismod semper. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec ullamcorper nulla non metus auctor fringilla.

Unstyled List Style

  • 4 loaves whole wheat bread
  • 1 lb. SweetLeaf Farms unsalted butter
  • 1 bag unrefined sugar
  • 2 boxes graham crackers, crumbled
  • 1 bag butterscotch hard candies. Now, this line item may require some explanation, at least for text-wrap demonstration: Vestibulum id ligula porta felis euismod semper. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec ullamcorper nulla non metus auctor fringilla.
    • Best not use Werther's. Those aren't butterscotch, they're caramel.
    • Look for the ones individually wrapped in crinkly, transparent yellow cellophane.
  • 17 rolls of tin foil
  • 9 sq feet of polysterene floor liner
  • 1 player piano

Stacked Unstyled List

Just wrap an unstyled list (.ls-none) in a .stack and style with utilities.

Here's some trailing text for showing some flow. Donec sed odio dui. Nulla vitae elit libero, a pharetra augue. Sed posuere consectetur est at lobortis. Vestibulum id ligula porta felis euismod semper. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec ullamcorper nulla non metus auctor fringilla.

Inline Lists

Here's some trailing text for showing some flow. Donec sed odio dui. Nulla vitae elit libero, a pharetra augue. Sed posuere consectetur est at lobortis. Vestibulum id ligula porta felis euismod semper. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec ullamcorper nulla non metus auctor fringilla.

Ordered List

  1. Place laptop onto kitchen table.
  2. Open laptop to its normal usage position.
  3. Walk over to your refrigerator.
    1. Open the refrigerator door.
    2. Retrieve a carton of milk.
      1. You may use whole, low-fat or skim.
      2. Dairy milk will work best, but soy milk or almond milk can work, too.
      3. If you have no milk, you can use juice or water.
    3. Close the refrigerator door.
  4. Return to table with milk.
  5. Open the container of milk.
  6. While holding the container above the computer, turn it over, pouring all the contents of the carton onto the laptop keyboard and screen.
  7. Make sure your files were backed up.

Here's some trailing text for showing some flow. Donec sed odio dui. Nulla vitae elit libero, a pharetra augue. Sed posuere consectetur est at lobortis. Vestibulum id ligula porta felis euismod semper. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec ullamcorper nulla non metus auctor fringilla.


Definition List

Works like the grid. Element dl extends .row. Elements dt and dd extend .col and stack by default, but can be overridden individually just by adding grid column classes: w--<value>@<breakpoint>.

Single room
$199/night (breakfast included, VAT not included)
Double room
$239/night (breakfast included, VAT not included)

Here's some trailing text for showing some flow. Donec sed odio dui. Nulla vitae elit libero, a pharetra augue. Sed posuere consectetur est at lobortis. Vestibulum id ligula porta felis euismod semper. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec ullamcorper nulla non metus auctor fringilla.


May the Fourth be With You ( @ 1.35rem)

Sed posuere consectetur est at lobortis. Donec sed odio dui. Nulla vitae elit libero, a pharetra augue. Sed posuere consectetur est at lobortis. Cras mattis consectetur purus sit amet fermentum. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum.

Sometimes We'll Use Heading Five ( @ 1.24rem)

Donec sed odio dui. Nullam quis risus eget urna mollis ornare vel eu leo. Cras mattis consectetur purus sit amet fermentum. Vestibulum id ligula porta felis euismod semper. Sed posuere consectetur est at lobortis. Cras justo odio, dapibus ac facilisis in, egestas eget quam.

And Even Heading Six if We're Really Feeling It ( @ 1rem)

Cras justo odio, dapibus ac facilisis in, egestas eget quam. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Maecenas sed diam eget risus varius blandit sit amet non magna. Aenean lacinia bibendum nulla sed consectetur.

Here's a tiny footnote set at fs-xs ( @ 0.76rem).

Dapibus Justo Fermentum Euismod Tortor

Default Section Header

Nulla vitae elit libero, a pharetra augue.

Etiam porta sem malesuada magna mollis euismod. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sed odio dui. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.

Fermentum Euismod

Integer posuere erat a ante venenatis dapibus posuere velit aliquet.

Augue donec sed odio dui. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec id elit non mi porta gravida at eget metus.

Etiam porta sem malesuada magna mollis euismod. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sed odio dui. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.

Now for something completely different:

A Sample of Real-World Text

The text below comes from Northeastern's Faculty Handbook website

Tenure and Tenure-Track Faculty

Dismissal of a Tenure-Track Faculty whose term appointment has not expired or a Tenured faculty member is the most severe sanction which the University may impose. An administrative officer who intends to request that dismissal proceedings begin should do so only when there is clear evidence to show adequate cause (see Section I.A.2) for dismissal. Except in an unusually serious or sudden case of gross personal misconduct (including sexual harassment), gross neglect of duty, or unfitness in one’s professional capacity, a request for dismissal proceedings should come forth only after a history of prior formal disciplinary action has been established.

Preliminary Proceedings Concerning Cause for Dismissal of a Faculty Member

When reason arises to consider dismissal of a faculty member, the Provost (or a representative specifically designated by the Provost) should discuss the matter with him/her in personal conference and provide him/her with a copy of this Dismissal Proceedings procedure module of the Faculty Handbook. The matter may be terminated by mutual consent at that point, a corrective disciplinary sanction may be imposed (with the faculty member retaining his/her rights under the Faculty Grievance Procedure), or a request to commence dismissal proceedings may be made by the President to the Faculty Senate Agenda Committee.

In the request the President shall state, in general terms, the grounds for dismissal of the faculty member and shall state that a bill of particulars has been prepared which will be delivered to a Committee of Inquiry when it commences its investigation.

  1. At the same time that the request for dismissal proceedings is sent to the Senate Agenda Committee a copy of that request shall be delivered to the faculty member.
  2. The bill of particulars shall include:
    • The specific charge(s) that would establish cause for dismissal, clearly identifying the rules, regulations, policies, and/or norms of professional conduct alleged to have been violated.
    • For each charge alleged as the basis for dismissal:
      • the time or times of alleged cause;
      • the place or places of alleged cause;
      • the manner in which alleged cause was committed (the activity or failure to act);
      • the means, if any, employed to commit the alleged cause;
      • the name or names of person(s), if any, other than the accused, present during commission of alleged cause and of whom the University currently has knowledge (or upon whom the University plans to rely in proof of its case).
    • For each charge alleged as the basis for dismissal: A statement detailing previous disciplinary action taken against the faculty member with respect to each charge alleged as the basis for dismissal.
  3. At the same time that the bill of particulars is sent to the Committee of Inquiry a copy shall be delivered to the faculty member.

When the Senate Agenda Committee has received the President’s request, it shall appoint a Committee of Inquiry consisting of five faculty members not part of the department or equivalent academic unit to which the person under investigation belongs1.

  1. The function of the Committee of Inquiry shall be to conduct an informal inquiry into the situation specified in the bill of particulars and to determine whether, in its view, there is sufficient evidence to demonstrate probable cause for dismissal.
  2. It is the burden of the University to present the specific charges against the faculty member. The Committee of Inquiry will reach its findings solely on the basis of the charges brought, and will not formulate charges which have not already been specified in the bill of particulars.
  3. During the informal inquiry, neither the University nor the faculty member is entitled to representation by an attorney before the Committee of Inquiry. However, the faculty member is permitted to bring another faculty member, as an observer, to any meeting between him/her and the Committee.
  4. The Committee of Inquiry shall submit its findings in writing to the President with a specific finding as to each charge and a conclusion as to whether probable cause exists to justify commencing formal dismissal proceedings.
  5. When the President and the Committee of Inquiry agree that probable cause for dismissal exists, a written statement to that effect shall be jointly formulated, specifying the charges. If there is disagreement between the President and the Committee of Inquiry, the President reserves the right to proceed to a formal dismissal hearing based on a unilaterally formulated statement of charges.
  6. A communication from the President to the faculty member, together with any statement formulated in step 5) shall inform the faculty member that further action will not proceed or shall inform him/her that formal dismissal proceedings will proceed. A copy of this communication and the detailed statement of charges shall be transmitted to the Senate Agenda Committee.

Commencement of Formal Proceedings[47]

  1. Upon receipt of the President’s communication that dismissal proceedings shall commence, and the statement of charges, the Senate Agenda Committee shall serve notice to the faculty member that a hearing to determine whether he/she should be removed from his/her faculty position on the grounds stated will be conducted at a specified date, time and place[48].
  2. Notice of hearing will be served at least thirty calendar days prior to the date of the hearing. The faculty member may waive a hearing or may respond to the charges in writing at any time before the hearing. In any case, the faculty member must make a detailed and specific written response to the statement of charges not less than fourteen calendar days before the date of the hearing for the written response to be considered for hearing proceedings.
  3. If the faculty member does not respond to the notice of hearing and statement of charges, the hearing will go forward with the faculty member’s participation limited to offering oral testimony at the hearing, if he/she chooses to participate at all. If the faculty member denies the charges or asserts that the charges do not support a finding of adequate cause in his/her written submission prior to the hearing, but nonetheless waives a hearing, the hearing will go forward and the faculty member may participate relying on his/her previously submitted written statement and his/her oral testimony at the hearing.
Default blockquote says lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.
Person Name
Washington Post

Assistance for Committee of Inquiry and Hearing Committee[2]

  1. In the course of preliminary proceedings and/or formal dismissal proceedings, the Senate Agenda Committee may deem it necessary to seek legal counsel on issues of process, for itself or for the Committee of Inquiry. The Agenda Committee will appoint such counsel. The University administration will provide a reasonable budget to meet the expense of such counsel.
  2. To assure impartiality of the Agenda Committee’s counsel, and to assure impartiality of the hearing master, payments to these persons will be made from a budget account established by the University administration for that purpose at the commencement of dismissal proceedings, and administered by the Agenda Committee (subject to regular University budgetary procedures). In addition, this budget will cover the costs of preparing transcripts as required below.

Hearing Committee

  1. The Hearing Committee will be comprised of six faculty members chosen by the Senate Agenda Committee from among its members and/or the members of the previous four Agenda Committees.
  2. A master will be appointed to facilitate the hearing process as an agent of the Hearing Committee. The master will be a legal professional with experience as an arbitrator, chosen by the Hearing Committee.

Committee Proceeding

Representation by Counsel[4]

  1. During the proceedings the faculty member is entitled to counsel and an academic advisor of his/her choice. The administration’s case may be offered by an administrator designated by the President and/or by designated counsel[5].

Hearing Proceedings

Guilty as chargerd, Sir

  1. Initial Hearing Session: The initial session of the hearing will take place on the date established by the Agenda Committee in the notice of hearing. A postponement may be granted only at the will of the Hearing Committee. This session will bring together the parties, the Hearing Committee and the master, to place in the record the statement of charges and to deal with preliminary procedural matters.  The session will be convened by the Chair of the Hearing Committee. After having been introduced to the parties, the master will then preside.  Upon adjournment of the initial session, the formal hearing before the Committee will normally resume only after the master has completed the findings of fact.
  2. Fact Finding: To facilitate the progress of the formal hearing, the Hearing Committee will designate the master to be its agent in determining the facts of the case. The master will hold evidentiary sessions in which the administration and the faculty member will present the evidence in the case, including testimony and cross-examination of witnesses. A verbatim transcript will be taken.
  3. Hearing Committee members will not be required to attend these sessions.When the presentation of evidence is concluded, the master will make the findings of fact. These findings shall be presented to the Hearing Committee, in writing. The University and the faculty member may present specific written exceptions to the findings of fact if they believe that a finding is not reasonably based on evidence in the record.  The transcript of the presentation of evidence will be made available to the Hearing Committee.

Procedures

Step 1
Part A
  1. The Hearing Committee and the master will not be bound by strict legal rules of evidence, and may admit any evidence which has a tendency to prove any fact of consequence to a determination of the issues to be decided relative to the rules, regulations, policies, and/or norms of professional conduct alleged to have been violated.
    Unless special circumstances warrant, it should not be necessary to follow formal rules of court procedure. The Hearing Committee, in consultation with the master, will make rulings with regard to granting adjournment or termination of the hearing.
  2. The proceedings shall be closed unless all parties including the Hearing Committee agree that they should be open.
  3. Consistent with this module, the faculty member will be afforded an opportunity to obtain necessary witnesses and documentary or other evidence. To this end, the administration will cooperate with the Hearing Committee and the master in attempting to secure witnesses and making available documentary and other evidence. The master shall provide a schedule for the notice of witnesses and other evidence. Unreasonable or unexplained failure to adhere to the schedule, as determined by the master, risks forfeiture of availability to present witnesses and other evidence.
  4. The faculty member and the administration will have the right to confront and cross-examine all witnesses unless the faculty member has been excluded from doing so under the terms of II.B. and II.C. above. Where witnesses cannot or will not appear, but the master or the Hearing Committee determines that the interests of justice require admission of their statements, the witnesses will be identified; the master will conduct an interview, if possible, and will read a report of the interview into the record.
  5. In the hearing on the bill of particulars, the testimony may include that of experts including qualified faculty members from this or other colleges or universities.
  6. A verbatim transcript of the fact-finding sessions and of the hearing will be taken. Once the transcript has been received from the stenographer, a copy will be made available to the faculty member at his/her request.

Formal Hearing

  1. When the formal hearing resumes, the Hearing Committee will receive the master’s findings and any exceptions thereto, and will hear oral argument by both sides.
  2. If circumstances warrant, the Hearing Committee may request documentary evidence or the appearance of witnesses other than those presented by the faculty member or the administration. The Hearing Committee or the master (at its request) may reexamine witnesses heard during the fact- finding.
  3. If the Hearing Committee feels that written briefs would be helpful, it may request them.

Consideration by Hearing Committee

  1. The Hearing Committee will reach its decision in conference without assistance of counsel or the master. The findings of fact and the decision will be based solely on the hearing record. The burden of proof that adequate cause exists rests with the administration and will be satisfied only by clear and convincing evidence in the record considered as a whole.
  2. The Hearing Committee will make explicit findings with respect to each of the charges presented. It may, at its discretion, prepare a reasoned opinion. If the Hearing Committee decides that the facts establish adequate cause for some form of discipline, but not for dismissal, it may recommend a disciplinary sanction other than dismissal. If a faculty member has previously been suspended without pay, such a suspension may not be recommended by the Hearing Committee.
  3. Publicity concerning the Hearing Committee’s decision should be withheld until final consideration has been given to the case by the Board of Trustees. Any release to the public should be made through the President’s Office.

Consideration by the Board of Trustees

  1. The President will transmit to the Board of Trustees the full report of the Hearing Committee, stating its action. If the Board of Trustees, or a duly authorized committee thereof, chooses to review the case, its review will be based on the record of the committee hearing, and it may provide opportunity for argument, oral, written or both, by the principals at the hearing, or by their representatives. The decision of the Hearing Committee should either be sustained or the proceeding returned to the Committee with objections specified. If the Board of Trustees has objections regarding limited aspects of the Hearing Committee decision, the decision may be returned to the Hearing Committee for reconsideration limited to those specified issues.
  2. The Committee will then reconsider, taking into account the stated objections and receiving new evidence if necessary according to procedures (section V.B. of this module) the Committee provides in writing to the principals from the hearing, or to their representatives. It should frame its decision and communicate it in the same manner as before. The Board of Trustees will make a final decision only after study of the Committee’s reconsideration.
  3. The Faculty Grievance Procedure shall not apply to this Dismissal Procedure or any final action taken pursuant to it.

Suspension of the Faculty Member during Proceedings

The University may institute suspension of the faculty member during the proceedings only if immediate harm to the faculty member or to others is threatened by continuing his/her employment responsibilities. Unless legal considerations forbid, any such suspension shall be with pay.

Publicity

Except for such simple announcements as may be required, covering the time of the hearing and similar matters, public statements about the case by the faculty member, administrative officers, Hearing Committee members, or legal counsel shall be avoided so far as possible until the proceedings have been completed. Announcement of the final decision shall be made by the President. If the final decision differs from the Hearing Committee’s recommendation, the announcement shall include a statement of that recommendation.


  1. If a Review Committee under the Sexual Harassment Procedure (adopted by the Board of Trustees, on March 24, 1982 has recommended that the faculty member be dismissed and the President concurs, the President shall request a formal dismissal proceeding without the informal inquiry steps enumerated in this subsection. The Review Committee shall be deemed to have substituted for the Committee of Inquiry, and the Review Committee’s evidence, determination, and summary of reasons shall replace those which would have come from the Committee of Inquiry. In all other respects, the dismissal procedure shall be followed.
Display Sizes
Display Size 1:

Donec sed odio dui. Nullam quis risus eget urna mollis1 ornare vel eu leo. ( @ 1.24rem/1.4)


Display Size 2:

Donec sed odio dui. Nullam quis risus eget urna mollis1 ornare vel eu leo. ( @ 1.53rem/1.4)


Display Size 3:

Donec sed odio dui. Nullam quis risus eget urna mollis1 ornare vel eu leo. ( @ 2.13rem/1.3)


Display Size 4:

Donec sed odio dui. Nullam quis risus eget urna mollis1 ornare vel eu leo. ( @ 3rem/1.1)


Display Size 5:

Donec sed odio dui. Nullam quis risus eget urna mollis1 ornare vel eu leo. ( @ 4.5rem/1.05)


Display Size 6:

Donec sed odio dui. Nullam quis risus eget urna mollis1 ornare vel eu leo. ( @ 4.5rem/1.05)


Display Size 7:

Donec sed odio dui. Nullam quis risus eget urna mollis1 ornare vel eu leo. ( @ 4.5rem/1.05)


Here's a Default Section Title

Subtitlio Defaultus Ridiculum Inceptos Bibendum Amet Mollis Dapibus

Maecenas faucibus

And some text to follow maecenas sed diam eget risus varius blandit sit amet non magna. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Nullam quis risus eget urna mollis ornare vel eu leo. Maecenas faucibus mollis interdum.

Maecenas faucibus

And some text to follow maecenas sed diam eget risus varius blandit sit amet non magna. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Nullam quis risus eget urna mollis ornare vel eu leo. Maecenas faucibus mollis interdum.

And some text to follow maecenas sed diam eget risus varius blandit sit amet non magna. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Nullam quis risus eget urna mollis ornare vel eu leo. Maecenas faucibus mollis interdum.

Blockquotes
Default blockquote says lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.
Person Name
Washington Post

Blockquote says a colored background is nice sometimes. Lorem ipsum dolor sit amet, consectetur adipisicing elit.

Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.

Shadowy blockquote has a mark. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.
Basic Table
Dolor Vestibulum Commodo Vehicula Elit Mattis Mollis
Ultricies Justo Aenean lacinia bibendum nulla sed consectetur. Cras mattis consectetur purus sit amet fermentum.
Lorem Nullam Donec ullamcorper nulla non metus auctor fringilla. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Adipiscing Condimentum Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Curabitur blandit tempus porttitor.
With No Borders
Dolor Vestibulum Commodo Vehicula Elit Mattis Mollis
Ultricies Justo Aenean lacinia bibendum nulla sed consectetur. Cras mattis consectetur purus sit amet fermentum.
Lorem Nullam Donec ullamcorper nulla non metus auctor fringilla. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Adipiscing Condimentum Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Curabitur blandit tempus porttitor.
With Alternating Stripes
Dolor Vestibulum Commodo Vehicula Elit Mattis Mollis
Ultricies Justo Aenean lacinia bibendum nulla sed consectetur. Cras mattis consectetur purus sit amet fermentum.
Lorem Nullam Donec ullamcorper nulla non metus auctor fringilla. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Fusce Condimentum Adipiscing dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Curabitur blandit tempus porttitor.
Justo Ultricies Aenean lacinia bibendum nulla sed consectetur. Cras mattis consectetur purus sit amet fermentum.
Accio Lorem Ipsum Donec ullamcorper nulla non metus auctor fringilla. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Adipiscing Condimentum Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Curabitur blandit tempus porttitor.
Responsive Table (horizontal scroll <@t)
Dolor Vestibulum Commodo Vehicula Elit Mattis Mollis Dolor Vestibulum Commodo Vehicula Elit Mattis Mollis
Ultricies Justo Aenean lacinia bibendum nulla sed consectetur. Cras mattis consectetur purus sit amet fermentum. Lorem Nullam Donec ullamcorper nulla non metus auctor fringilla. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Fusce Condimentum Adipiscing dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Shading on this cell (using td.--shaded). Curabitur blandit tempus porttitor. Justo Ultricies Aenean lacinia bibendum nulla sed consectetur. Cras mattis consectetur purus sit amet fermentum.
Accio Lorem Ipsum Donec ullamcorper nulla non metus auctor fringilla. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Adipiscing Condimentum Shading on this cell (using td.--shaded). Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Curabitur blandit tempus porttitor.
Ultricies Justo Aenean lacinia bibendum nulla sed consectetur. Cras mattis consectetur purus sit amet fermentum. Lorem Nullam Donec ullamcorper nulla non metus auctor fringilla. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Shading On Whole Row (using tr.--shaded) Adipiscing dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Shading on this cell. Curabitur blandit tempus porttitor. Justo Ultricies Aenean lacinia bibendum nulla sed consectetur. Cras mattis consectetur purus sit amet fermentum.