<!DOCTYPE html>
<
html
>
<
head
>
<
link
rel
=
'stylesheet'
href='
<
link
rel
=
"stylesheet"
href
=
/>
<
style
>
.file{
margin-top: 25px;
}
</
style
>
</
head
>
<
body
class
=
"has-text-centered"
>
<
h1
class
=
"is-size-2 has-text-success"
>
GeeksforGeeks
</
h1
>
<
b
class
=
"is-size-4"
>Bulma File Colors</
b
>
<
div
class
=
"container"
>
<
div
class="file has-name
is-centered
is-link">
<
label
class
=
"file-label"
>
<
input
class
=
"file-input"
type
=
"file"
name
=
"selected-image"
>
<
span
class
=
"file-cta"
>
<
span
class
=
"file-icon"
>
<
i
class
=
"fas fa-upload"
></
i
>
</
span
>
<
span
class
=
"file-label"
>
Link Colored File
</
span
>
</
span
>
<
span
class
=
"file-name"
>
No Image Selected.
</
span
>
</
label
>
</
div
>
<
div
class="file has-name
is-centered
is-black">
<
label
class
=
"file-label"
>
<
input
class
=
"file-input"
type
=
"file"
name
=
"selected-image"
>
<
span
class
=
"file-cta"
>
<
span
class
=
"file-icon"
>
<
i
class
=
"fas fa-upload"
></
i
>
</
span
>
<
span
class
=
"file-label"
>
Black Colored File
</
span
>
</
span
>
<
span
class
=
"file-name"
>
No Image Selected.
</
span
>
</
label
>
</
div
>
<
div
class="file has-name
is-centered
is-danger">
<
label
class
=
"file-label"
>
<
input
class
=
"file-input"
type
=
"file"
name
=
"selected-image"
>
<
span
class
=
"file-cta"
>
<
span
class
=
"file-icon"
>
<
i
class
=
"fas fa-upload"
></
i
>
</
span
>
<
span
class
=
"file-label"
>
Danger Colored File
</
span
>
</
span
>
<
span
class
=
"file-name"
>
No Image Selected.
</
span
>
</
label
>
</
div
>
<
div
class
=
"file has-name is-centered is-info"
>
<
label
class
=
"file-label"
>
<
input
class
=
"file-input"
type
=
"file"
name
=
"selected-image"
>
<
span
class
=
"file-cta"
>
<
span
class
=
"file-icon"
>
<
i
class
=
"fas fa-upload"
></
i
>
</
span
>
<
span
class
=
"file-label"
>
Info Colored File
</
span
>
</
span
>
<
span
class
=
"file-name"
>
No Image Selected.
</
span
>
</
label
>
</
div
>
<
div
class
=
"file has-name is-centered is-primary"
>
<
label
class
=
"file-label"
>
<
input
class
=
"file-input"
type
=
"file"
name
=
"selected-image"
>
<
span
class
=
"file-cta"
>
<
span
class
=
"file-icon"
>
<
i
class
=
"fas fa-upload"
></
i
>
</
span
>
<
span
class
=
"file-label"
>
Primary Colored File
</
span
>
</
span
>
<
span
class
=
"file-name"
>
No Image Selected.
</
span
>
</
label
>
</
div
>
</
div
>
</
body
>
</
html
>