Lyrics

PhlexIcons::Material

Source code

Icon (Variant: :outlined) ↓

With Phlex::Kit

Material::Lyrics(variant: :outlined)

Without Phlex::Kit (e.g. ERB) ↓

render PhlexIcons::Material::Lyrics.new(variant: :outlined)

Plain Phlex ↓

def view_template
	svg(
		**attrs,
		fill: 'currentColor',
		xmlns: 'http://www.w3.org/2000/svg', viewbox: '0 0 24 24'
	) do |s|
		s.path(d: 'M6 6h7v2H6zm0 6h4v2H6z')
		s.path(
			d:
				'M15 11.97V16H6l-2 2V4h11v2.03c.52-.69 1.2-1.25 2-1.6V4c0-1.1-.9-2-2-2H4c-1.1 0-1.99.9-1.99 2L2 22l4-4h9c1.1 0 2-.9 2-2v-2.42a5.16 5.16 0 0 1-2-1.61z'
		)
		s.path(
			d:
				'M6 9h7v2H6zm14-2.82c-.31-.11-.65-.18-1-.18-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3V3h2V1h-4v5.18z'
		)
	end
end

Plain SVG ↓

<svg xmlns="http://www.w3.org/2000/svg" class="" fill="currentColor" viewbox="0 0 24 24">
	<path d="M6 6h7v2H6zm0 6h4v2H6z"></path>
	<path d="M15 11.97V16H6l-2 2V4h11v2.03c.52-.69 1.2-1.25 2-1.6V4c0-1.1-.9-2-2-2H4c-1.1 0-1.99.9-1.99 2L2 22l4-4h9c1.1 0 2-.9 2-2v-2.42a5.16 5.16 0 0 1-2-1.61z"></path>
	<path d="M6 9h7v2H6zm14-2.82c-.31-.11-.65-.18-1-.18-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3V3h2V1h-4v5.18z"></path>
</svg>

Icon (Variant: :filled) ↓

With Phlex::Kit

Material::Lyrics(variant: :filled)

Without Phlex::Kit (e.g. ERB) ↓

render PhlexIcons::Material::Lyrics.new(variant: :filled)

Plain Phlex ↓

def view_template
	svg(
		**attrs,
		fill: 'currentColor',
		xmlns: 'http://www.w3.org/2000/svg', viewbox: '0 0 24 24'
	) do |s|
		s.path(
			d:
				'M14 9c0-2.04 1.24-3.79 3-4.57V4c0-1.1-.9-2-2-2H4c-1.1 0-1.99.9-1.99 2L2 22l4-4h9c1.1 0 2-.9 2-2v-2.42c-1.76-.78-3-2.53-3-4.58zm-4 5H6v-2h4v2zm3-3H6V9h7v2zm0-3H6V6h7v2z'
		)
		s.path(
			d:
				'M20 6.18c-.31-.11-.65-.18-1-.18-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3V3h2V1h-4v5.18z'
		)
	end
end

Plain SVG ↓

<svg xmlns="http://www.w3.org/2000/svg" class="" fill="currentColor" viewbox="0 0 24 24">
	<path d="M14 9c0-2.04 1.24-3.79 3-4.57V4c0-1.1-.9-2-2-2H4c-1.1 0-1.99.9-1.99 2L2 22l4-4h9c1.1 0 2-.9 2-2v-2.42c-1.76-.78-3-2.53-3-4.58zm-4 5H6v-2h4v2zm3-3H6V9h7v2zm0-3H6V6h7v2z"></path>
	<path d="M20 6.18c-.31-.11-.65-.18-1-.18-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3V3h2V1h-4v5.18z"></path>
</svg>

Icon (Variant: :round) ↓

With Phlex::Kit

Material::Lyrics(variant: :round)

Without Phlex::Kit (e.g. ERB) ↓

render PhlexIcons::Material::Lyrics.new(variant: :round)

Plain Phlex ↓

def view_template
	svg(
		**attrs,
		fill: 'currentColor',
		xmlns: 'http://www.w3.org/2000/svg', viewbox: '0 0 24 24'
	) do |s|
		s.path(
			d:
				'M14 9c0-2.04 1.24-3.79 3-4.57V4c0-1.1-.9-2-2-2H4c-1.1 0-1.99.9-1.99 2L2 22l4-4h9c1.1 0 2-.9 2-2v-2.42c-1.76-.78-3-2.53-3-4.58zm-4 5H6v-2h4v2zm3-3H6V9h7v2zm0-3H6V6h7v2z'
		)
		s.path(
			d:
				'M20 6.18c-.31-.11-.65-.18-1-.18-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3V3h2V1h-4v5.18z'
		)
	end
end

Plain SVG ↓

<svg xmlns="http://www.w3.org/2000/svg" class="" fill="currentColor" viewbox="0 0 24 24">
	<path d="M14 9c0-2.04 1.24-3.79 3-4.57V4c0-1.1-.9-2-2-2H4c-1.1 0-1.99.9-1.99 2L2 22l4-4h9c1.1 0 2-.9 2-2v-2.42c-1.76-.78-3-2.53-3-4.58zm-4 5H6v-2h4v2zm3-3H6V9h7v2zm0-3H6V6h7v2z"></path>
	<path d="M20 6.18c-.31-.11-.65-.18-1-.18-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3V3h2V1h-4v5.18z"></path>
</svg>

Icon (Variant: :sharp) ↓

With Phlex::Kit

Material::Lyrics(variant: :sharp)

Without Phlex::Kit (e.g. ERB) ↓

render PhlexIcons::Material::Lyrics.new(variant: :sharp)

Plain Phlex ↓

def view_template
	svg(
		**attrs,
		fill: 'currentColor',
		xmlns: 'http://www.w3.org/2000/svg', viewbox: '0 0 24 24'
	) do |s|
		s.path(
			d:
				'M14 9c0-2.04 1.24-3.79 3-4.57V4c0-1.1-.9-2-2-2H4c-1.1 0-1.99.9-1.99 2L2 22l4-4h9c1.1 0 2-.9 2-2v-2.42c-1.76-.78-3-2.53-3-4.58zm-4 5H6v-2h4v2zm3-3H6V9h7v2zm0-3H6V6h7v2z'
		)
		s.path(
			d:
				'M20 6.18c-.31-.11-.65-.18-1-.18-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3V3h2V1h-4v5.18z'
		)
	end
end

Plain SVG ↓

<svg xmlns="http://www.w3.org/2000/svg" class="" fill="currentColor" viewbox="0 0 24 24">
	<path d="M14 9c0-2.04 1.24-3.79 3-4.57V4c0-1.1-.9-2-2-2H4c-1.1 0-1.99.9-1.99 2L2 22l4-4h9c1.1 0 2-.9 2-2v-2.42c-1.76-.78-3-2.53-3-4.58zm-4 5H6v-2h4v2zm3-3H6V9h7v2zm0-3H6V6h7v2z"></path>
	<path d="M20 6.18c-.31-.11-.65-.18-1-.18-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3V3h2V1h-4v5.18z"></path>
</svg>

Icon (Variant: :two_tone) ↓

With Phlex::Kit

Material::Lyrics(variant: :two_tone)

Without Phlex::Kit (e.g. ERB) ↓

render PhlexIcons::Material::Lyrics.new(variant: :two_tone)

Plain Phlex ↓

def view_template
	svg(
		**attrs,
		fill: 'currentColor',
		xmlns: 'http://www.w3.org/2000/svg', viewbox: '0 0 24 24'
	) do |s|
		s.path(
			d:
				'M4 4v14l2-2h9v-4.03c-.62-.83-1-1.85-1-2.97s.38-2.14 1-2.97V4H4zm6 10H6v-2h4v2zm3-3H6V9h7v2zm0-3H6V6h7v2z',
			opacity: '.3'
		)
		s.path(d: 'M6 12h4v2H6zm0-6h7v2H6z')
		s.path(
			d:
				'M15 11.97V16H6l-2 2V4h11v2.03c.52-.69 1.2-1.25 2-1.6V4c0-1.1-.9-2-2-2H4c-1.1 0-1.99.9-1.99 2L2 22l4-4h9c1.1 0 2-.9 2-2v-2.42a5.16 5.16 0 0 1-2-1.61z'
		)
		s.path(
			d:
				'M6 9h7v2H6zm14-2.82c-.31-.11-.65-.18-1-.18-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3V3h2V1h-4v5.18z'
		)
	end
end

Plain SVG ↓

<svg xmlns="http://www.w3.org/2000/svg" class="" fill="currentColor" viewbox="0 0 24 24">
	<path d="M4 4v14l2-2h9v-4.03c-.62-.83-1-1.85-1-2.97s.38-2.14 1-2.97V4H4zm6 10H6v-2h4v2zm3-3H6V9h7v2zm0-3H6V6h7v2z" opacity=".3"></path>
	<path d="M6 12h4v2H6zm0-6h7v2H6z"></path>
	<path d="M15 11.97V16H6l-2 2V4h11v2.03c.52-.69 1.2-1.25 2-1.6V4c0-1.1-.9-2-2-2H4c-1.1 0-1.99.9-1.99 2L2 22l4-4h9c1.1 0 2-.9 2-2v-2.42a5.16 5.16 0 0 1-2-1.61z"></path>
	<path d="M6 9h7v2H6zm14-2.82c-.31-.11-.65-.18-1-.18-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3V3h2V1h-4v5.18z"></path>
</svg>