UCLA Component Library

Links 

<!-- Default -->
<!-- Standard Link -->
<a href="#" class="link">This is an example of a link on light background</a>

<!-- White links on Blue Backgrounds -->
<!-- Note: background color included for better depiction -->
<div style="background: #2774AE;">
    <a class="white-link" href="#">This is an example of a link on dark background</a>
</div>

<br>


<!-- Inline -->
<p>
    This is an example of an <a class="link" href="#">inline</a> link on light background.
</p>

<p style="background: #2774AE; color: white;">
    This is an example of an <a class="white-link" href="#">inline</a> link on dark background.
</p>

<br>


<!-- Links In List -->
<ul>
    <li>...</li>
    <li>
        <a class="link" href="#">Link in List</a>
    </li>
    <li>...</li>
</ul>


<!-- Related Links -->
<ul class="related-links">
    <li><a href="#">This is an Internal Link</a></li>
    <li><a class="ext-link" href="#">This is an External Link</a></li>
    <li><a class="" href="#">This is a Link to a Download (pdf)</a></li>
</ul>