GRT Pro Calculator Pricing

Here’s what you get with GRT Pro for just $57 per year 👇

GRT CSS for Unlimited Websites or Projects

Now that you’ve refined your results with the Calculator, the next step is to add GRT to your own site!

By becoming a GRT Pro, you’ll get GRT CSS—with variables!—each time you use the Pro Calculator.

Simply copy and paste the GRT CSS into your working environment, and boom! Instant GRT sizing, spacing, precision, and beauty on your website.

Oh, and some sweet new formatting elements for you to play with, too…

More on those in a moment, but for now, let’s take a quick look and see why the GRT CSS is so great.

CSS Custom Properties (Variables)

Professionals use variables to add power, convenience, and rapid prototyping abilities to their websites.

With GRT Pro, you’ll get perfectly calibrated, variable-driven CSS that will fit into any project.

Here’s what that looks like:

GRT CSS custom properties

GRT calculations are delivered as CSS custom properties…

Custom properties within GRT CSS

…and then referenced within the GRT CSS! This is how the pros do it 😎

But what if you prefer to use SCSS instead?

GRT CSS has you covered here, too—output your results in basic CSS or SCSS, and output your variables as CSS custom properties or SCSS variables!

Bottom line? GRT CSS will fit seamlessly into your current working environment.

Responsive CSS Serves up Delight on Any Device

GRT CSS is designed for responsiveness, and it even includes thoughtful, detailed adjustments for smaller screens.

Specifically, headline and sub-headline font sizes are scaled down to fit better on small devices. This ensures your messaging will have the same impact on visitors, regardless of their viewing device!

Now let’s take a look at those cool new formatting elements…

Eye-catching Content Formatting for Your Website

The point of Golden Ratio Typography is to provide your website with a beautiful, pixel-perfect foundation for typography and spacing.

No reason to stop there, though. That’s why your GRT CSS includes other content formatting elements that will help you win the attention game!

See that drop cap at the beginning of this section? GRT CSS includes drop cap styling that’s been precisely calibrated for whatever font you select.

Content Callouts

Next, you get what I consider to be the ultimate formatting element: Content callouts.

As you saw in the demo text from the Calculator, callouts come in three flavors—basic callouts, alerts, and notes.

Use eye-catching callouts like this alert to draw attention to important text you want visitors to read!

Callouts are even designed to accommodate more sophisticated content, such as a sub-heading followed by some descriptive text:

I know you’re reading this note.

And you’re totally reading this, too, simply because callouts are so good at getting your attention!

When you’re operating on the web—where attention is everything—callouts are a critical tool to have at your disposal.

Flexible Captions

Did you know? When people scan content, they always notice the following elements:

  1. Headlines
  2. Images
  3. Sub-headlines
  4. Captions

The first 3 should come as no surprise, but that fourth one? Kinda shocking!

It makes total sense, though. Captions are typically placed next to the highest-visibility elements on the page (images), and they’re short enough that everybody perceives them as being easy to read.

Can you guess what happens next?

People actually read the captions, making them sneaky-good vehicles for deploying critical information on your pages!

GRT CSS acknowledges this power and even kicks it up a notch with flexible captions, which “just work” when placed after any of the following elements:

  • Images
  • Sub-headlines
  • Callouts
  • Blockquotes (where captions automatically become citations 🤯)

Use these captions to sneak important information into lots of high-visibility places!

Additional Elements for Persuasive Presentations

Callouts and captions certainly stand out, but there’s still more magic lurking in your GRT CSS:

  • Find the right fit with image alignments (left, center, right)
  • Enhance your tutorials and instructions with keyboard formatting
  • Drop in code snippets with preformatted code styles
  • Increase clarity and credibility with footnotes

A note about performance: The GRT CSS weighs in at a svelte 6kB (uncompressed). Compare this to popular CSS library Bootstrap 4—which is 187kB (uncompressed)—and it’s clear we’re talking about a different universe of simplicity and performance.

Oh yeah, there’s one more thing, too…

Access to the GRT Pro Forums

Becoming a GRT Pro is just the beginning. After snagging your GRT CSS, you’ll explore other stages of the journey—implementation, best practices, customization, and creativity!

This stuff is every bit as important as the GRT CSS itself (maybe moreso, honestly).

And that’s why your purchase also gets you access to the GRT Pro Forums—the only place in the world dedicated to talking, implementing, and experimenting with typography!

Become a GRT Pro now!

Make your designs simpler, smarter, faster, and more beautiful.

Purchase GRT Pro!