Bob Ross Ipsum

There is a “Lorem ipsum” generator built right into Emmet, which we enable on CodePen by default. So if you type lorem-Tab, you’ll get some.

Good to know: you can customize how much you get of it by adding numbers. lorem10 is just 10 words of filler text. lorem1000 is 1,000 words of filler text.

Lorem ipsum is just gibberish (it’s not really Latin!) and the point of it is putting placeholder text in place when it doesn’t really matter what it says, you’re just designing something. If it’s going to be real text at some point, it’s probably a good idea to get your hands on that real text, but alas, sometimes placeholder copy will do.

Someone asked me today if any of the “other” filler text generators could be used on CodePen. Others? There are lots of fun ones, actually. A few favorites of mine: Cupcake Ipsum, Bacon Ipsum, and Samuel L. Ipsum. Their favorite? Bob Ross Lipsum.

So can you make happy little filler text happen on CodePen? Sure, and you can make it happen yourself by using custom snippets. The trick is to head to your editor settings and add a brand new HTML snippet.

Added two Bob Ross snippets

To avoid any text weirdness, I’m wrapping the text in curly braces and escaping the quotes.

{Hello, World! It[backslash]‘s a nice day out.}

And then, KAPOW, we got options.

The post Bob Ross Ipsum appeared first on CodePen Blog.

Flatlogic Admin Templates banner

367: With Micah Godbolt

I got to talk with Micah Godbolt this week! Micah is is a long-hauler at Microsoft working on Design Systems and such. His CodePen account looks a lot like mine: steady consistent usage of “just trying to figure something out” Pens sprinkled with some ideas that somehow seem to click with the wider front-end world. I found it fascinating that putting the word “Design Systems” into his book title “Front-end Architecture for Design Systems” was suggested by the publisher, and they were right! Turns out the term Design Systems clicked a lot harder since the 2016 publication and I’m sure hasn’t hurt sales!

Time Jumps

00:35 Guest introduction

02:46 Front end architecture for design systems

06:31 Building design systems

10:23 Sponsor: Linode

11:08 You don’t need a UI framework

17:49 Responsive multi-level nav pen

19:30 Multi height equal column pen

23:01 How do you ship components?

27:00 Testing for bugs

28:41 Consistently making pens

35:13 Creating a stripped down use case

40:06 Where can people find out more

Sponsor: Linode

Visit and see why over a million developers trust Linode for the infrastructure.  From their award-winning support (offered 24/7/365 to every level of user) to ease of use and set up; it’s clear why developers have been trusting Linode for projects both big and small since 2003.   Linode offers the industry’s best price-to-performance value for all compute instances, including shared, dedicated, high memory, and GPUs. Linode makes cloud computing simple, affordable, and accessible allowing you to focus on your customers, not your infrastructure.  Visit, create a free account and you’ll get $100 in credit.

The post 367: With Micah Godbolt appeared first on CodePen Blog.

Flatlogic Admin Templates banner