Tailwind CSS Typography Quiz
Want to learn more than this quiz offers you? Have a look at my Frontend web
development courses.
Create an account and save your quiz results
Login and save your results
OR
Question 1/15
If you want to apply italic style to text in Tailwind CSS, which class would you use?
Select your answer
Question 2/15
How do you make text bold in Tailwind CSS?
Select your answer
Question 3/15
Which class would you use to make text lowercase in Tailwind CSS?
Select your answer
Question 4/15
How would you specify a text color of blue with Tailwind CSS?
Select your answer
Question 5/15
What is the Tailwind CSS class for making text smaller than the normal size?
Select your answer
Question 6/15
How do you set a custom font size using Tailwind CSS?
Select your answer
Question 7/15
What Tailwind CSS class makes text left aligned?
Select your answer
Question 8/15
How do you change the text size to the largest pre-defined scale in Tailwind CSS?
Select your answer
Question 9/15
Which Tailwind CSS class sets the font weight to the lightest available option?
Select your answer
Question 10/15
In Tailwind CSS, what does the 'truncate' class do to text?
Select your answer
Question 11/15
Which class would you use to add a shadow effect to text?
Select your answer
Question 12/15
How do you set the font weight to 900, which is black in Tailwind CSS terms?
Select your answer
Question 13/15
How do you change the text size to 2xl in Tailwind CSS?
Select your answer
Question 14/15
Which class would you use to change the font to a monospace font in Tailwind CSS?
Select your answer
Question 15/15
Which Tailwind CSS class should be used to change the spacing between letters to tight?
Select your answer
Your Results
You did not answer any questions correctly.
Your Answers
Question 1/15
😊 Your
answer was correct
🙁 Your
answer was incorrect
If you want to apply italic style to text in Tailwind CSS, which class would you use?
Available answers
To apply italic styling, use the 'italic' class in Tailwind CSS.
Question 2/15
😊 Your
answer was correct
🙁 Your
answer was incorrect
How do you make text bold in Tailwind CSS?
Available answers
To make text bold in Tailwind CSS, use the class 'font-bold'.
Question 3/15
😊 Your
answer was correct
🙁 Your
answer was incorrect
Which class would you use to make text lowercase in Tailwind CSS?
Available answers
Use the 'lowercase' class to transform text to lowercase.
Question 4/15
😊 Your
answer was correct
🙁 Your
answer was incorrect
How would you specify a text color of blue with Tailwind CSS?
Available answers
'text-blue-500' in Tailwind CSS represents a blue color with medium intensity for text.
Question 5/15
😊 Your
answer was correct
🙁 Your
answer was incorrect
What is the Tailwind CSS class for making text smaller than the normal size?
Available answers
The 'text-xs' class in Tailwind CSS decreases the text size to extra small.
Question 6/15
😊 Your
answer was correct
🙁 Your
answer was incorrect
How do you set a custom font size using Tailwind CSS?
Available answers
Custom font sizes can be set using variants such as 'text-[20px]' directly on elements with Tailwind's JIT mode.
Question 7/15
😊 Your
answer was correct
🙁 Your
answer was incorrect
What Tailwind CSS class makes text left aligned?
Available answers
The 'text-left' class aligns text to the left in Tailwind CSS.
Question 8/15
😊 Your
answer was correct
🙁 Your
answer was incorrect
How do you change the text size to the largest pre-defined scale in Tailwind CSS?
Available answers
The 'text-9xl' class in Tailwind CSS sets the text size to the largest possible pre-defined scale.
Question 9/15
😊 Your
answer was correct
🙁 Your
answer was incorrect
Which Tailwind CSS class sets the font weight to the lightest available option?
Available answers
'font-extralight' is the lightest standard font weight setting available in Tailwind CSS.
Question 10/15
😊 Your
answer was correct
🙁 Your
answer was incorrect
In Tailwind CSS, what does the 'truncate' class do to text?
Available answers
The 'truncate' class shortens text and adds an ellipsis if it overflows its container.
Question 11/15
😊 Your
answer was correct
🙁 Your
answer was incorrect
Which class would you use to add a shadow effect to text?
Available answers
The 'shadow-md' class applies a medium shadow to elements, including text. In Tailwind CSS, shadows apply to the boundary of elements including text when used appropriately.
Question 12/15
😊 Your
answer was correct
🙁 Your
answer was incorrect
How do you set the font weight to 900, which is black in Tailwind CSS terms?
Available answers
In Tailwind CSS, 'font-black' sets the font weight to 900, the heaviest weight available.
Question 13/15
😊 Your
answer was correct
🙁 Your
answer was incorrect
How do you change the text size to 2xl in Tailwind CSS?
Available answers
The 'text-2xl' class in Tailwind CSS sets the text size to 2 extra large.
Question 14/15
😊 Your
answer was correct
🙁 Your
answer was incorrect
Which class would you use to change the font to a monospace font in Tailwind CSS?
Available answers
To use a monospace font, apply the 'font-mono' class in Tailwind CSS.
Question 15/15
😊 Your
answer was correct
🙁 Your
answer was incorrect
Which Tailwind CSS class should be used to change the spacing between letters to tight?
Available answers
The 'tracking-tight' class decreases the letter spacing to be closer than normal.