Skip to main content

This content of this site is still in development.

Textures

To make use of the stucco texture you may apply a background image over any color to create the stucco effect. Using the .stucco CSS class will apply a opaque PNG texture over your element. This will allow the existing background color to shade the texture to match.

CSS Code

This CSS rule is included automatically in the default UNM template. However, if you need to apply the texture to an element that does not allow you to add a CSS class to the html element you may simply apply the background-image listed to that element in your CSS.

.stucco { 
    background-image: url(//webcore.unm.edu/v2/images/stucco.png); 
}

Example Use

<div class="stucco">
    <h3>Preview</h3>
    <p>Text on a textured background</p>
</div>

Preview

Text on a textured background

<div class="stucco unm-cherry">
    <h3>Preview</h3>
    <p>Text on a textured background</p>
</div>

Preview

Text on a textured background


<div class="stucco unm-highnoon">
    <h3>Preview</h3>
    <p>Text on a textured background</p>
</div>

Preview

Text on a textured background

<div class="stucco unm-greenchile">
    <h3>Preview</h3>
    <p>Text on a textured background</p>
</div>

Preview

Text on a textured background