Brown sugar: Brown sugar is made with molasses, which gives the blondies a rich and chewy texture that sets them apart from your average recipe!
Sugar: White sugar is also essential to this recipe—I wouldn’t recommend trying to substitute it with coconut sugar or any other type of sugar.
Butter: Use REAL, full-fat butter for this recipe. (Unless you’re making them dairy-free. In that case, use vegan butter.)
Gluten-free flour: It’s important to use a high quality 1:1 baking flour to get the right texture and best results for these blondies!
Baking powder: Baking powder helps the blondies rise and adds chew.
Salt: Sea salt balances the sweetness and brings out the flavor of every ingredient in this recipe.
Vanilla: Of course, vanilla brownies aren’t complete without pure vanilla extract.
Chocolate chips: For this recipe I like to use a combination of white chocolate chips and semi-sweet chocolate chips. You could also use butterscotch chips, dark chocolate, or peanut butter chips if you prefer an alternative to the chocolate flavor. You also might like this white chocolate popcorn.
Eggs: Eggs act as a binder and add richness to the blondie batter.
1. Preheat the oven to 350 degrees and grease a 9×13 baking pan with cooking spray.
2. Cream room temperature butter and sugar together in a large mixing bowl or medium bowl, or in the bowl of a stand mixer.
3. Add room temperature eggs and vanilla extract.
4. Add the room temperature eggs and vanilla extract and mix until combined.
5. Pour in the gluten-free flour, almond flour, gluten-free baking powder and salt. Mix on low speed until totally combined and no dry streaks are left. Stir in the chocolate chips and pecans if using.
6. Spread the blondies batter into the prepared baking dish.
7. Bake at 350 degrees for 25-30 minutes, until golden brown.
This website packs a punch with vivid images that lead the viewer through the recipe process, scaled to various sizes that reflect their importance. Despite having small bottom/top margins, the website looks very open and appealing thanks to the thin and elegant typefaces and selective shifts in font weights and sizes.
I like this website's high contrast black-white-yellow color palette, but it's best feature is the text container that puts all the recipe information in a single place. Most other recipe websites force you to scroll a lot in order to read recipe instructions, which is not convenient. This website uses changing background colors, a shifting grid system, and a wide range of type styles, sizes, and weights to present dense information in an incredibly digestable (no pun intended) way.
This website takes the black-white-yellow color palette and the instruction container of Website 2 (though done with less visual clarity) and introduces additional elements to the main body text. Little emojis add character to the text, the large increase in text size for section heads effectively communicates information categories, and in-text highlights call attention to important details like recommended side dishes. While the recipe instruction box is less clear than Website 2, it greatly improves on the body text.
A sense of sleakness is created immediately on this website, with a color palette of black and white with earthy accents. This color palette relies on a more integral design element- the spatious and varied grid system. Images are displayed at different sizes based on their importance, separated by large gutters that create comfortable areas of visual rest.
The black-white-earth tone color palete has been a pattern across many websites I've investigated, but this one does it differently. Normally, white dominates the screen with black conveying information and the earth tone acting as an accent. This website uses the earth tone as a background, with black text boxes holding white text and sometimes earth-tone text. This creates an interesting positive/negative space dynamic that make this website unique and interesting.
Suitably, this website feels like it's in constant motion, and the scroll feature is the basis of that. As the user vertically scrolls, images grow or shrink in the background while text slides in from below, increasing in opacity as it does so. This is complemented by areas of rest where text (at a variety of sizes and weights) sits in a largely empty white area of the screen.