Skip to content
Branch: master
Go to file
Code

Latest commit

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
 
 
 
 

README.md

<focal-point> Custom Element

The <focal-point> mimicks a highlighter and has six pre-defined colors. This component is built using the HTML Custom Elements v1 spec. This element takes one attribute:

  • color - {string} Valid CSS color code/hex/rgb/rgba/hsl/hsla value. Predefined values to mimick generic highlighters are yellow, green, blue, orange, pink, and purple.

Color names

<focal-point color="yellow">
    Nullam ac ultricies justo, a tempor est. Aenean efficitur accumsan porttitor.
</focal-point>

<focal-point color="blue">
    Nullam ac ultricies justo, a tempor est. Aenean efficitur accumsan porttitor.
</focal-point>

<focal-point color="green">
    Nullam ac ultricies justo, a tempor est. Aenean efficitur accumsan porttitor.
</focal-point>

<focal-point color="pink">
    Nullam ac ultricies justo, a tempor est. Aenean efficitur accumsan porttitor.
</focal-point>

<focal-point color="orange">
    Nullam ac ultricies justo, a tempor est. Aenean efficitur accumsan porttitor.
</focal-point>

Hex Code

<focal-point color="#ffcc67">
    Nullam ac ultricies justo, a tempor est. Aenean efficitur accumsan porttitor.
</focal-point>

RGB Code

<focal-point color="rgb(100,100,200)">
    Nullam ac ultricies justo, a tempor est. Aenean efficitur accumsan porttitor.
</focal-point>

RGBA Code

<focal-point color="rgba(100,100,200, 0.5)">
    Nullam ac ultricies justo, a tempor est. Aenean efficitur accumsan porttitor.
</focal-point>

HSL Code

<focal-point color="hsl(120, 100%, 75%)">
    Nullam ac ultricies justo, a tempor est. Aenean efficitur accumsan porttitor.
</focal-point>

HSLA Code

<focal-point color="hsla(120, 100%, 75%, 0.6)">
    Nullam ac ultricies justo, a tempor est. Aenean efficitur accumsan porttitor.
</focal-point>

Donate

  • BTC: 18o3S3rzdBqfUndc4pZm9dNUrNJ5zijDon
  • ETH: 0x9289E1B3a846061B14E81FD521a3ac910EC908A7

About

<focal-point> web component built using the HTML Custom Element v1 spec

Resources

License

Releases

No releases published
You can’t perform that action at this time.